appendTo（）が使用されたときにClickイベントが動的要素にバインドされていない

Question

動的DOM要素については、jQuery.fn.onまたは委譲を使用する必要がありますが、ドーム、クリックはもう働きません。ここで

はjsFiddleは、問題を再現することである。 http://jsfiddle.net/j0L7c51f/

現在、私は、次のbindメソッド使用しています：私はUL要素を移動するコード行をコメントアウトした場合

$('#commoditySelector').on('click', 'li.available', function() { 
    var cmID = $(this).attr('data-cmid'); 
    $('#debug').html('commoditySelected: '+ cmID); 
}); 

をappendTo（）を使用すると、clickイベントの境界がうまく動作します。

Answer 1

この問題は、マウスが移動するたびにHTMLが再構築されるため、委任イベントハンドラではなく、mousemoveを使用することによって発生します。つまり、委任されたイベントハンドラはクリックされた要素で正しく起動されますが、その要素はすぐにDOMから削除されるため、処理されるDOMを伝播する前にイベントがキャンセルされます。

$('#commodityCategories li a').mouseenter(function(e) { 
    // your code... 
}); 

Updated fiddle