新しい並べ替え可能な項目でJQueryの.click（）が機能しない

Question

JQuery UIのSortable + Draggableリストがあり、ソート可能なすべての項目に対してJQuery .click（）を使用していますが、このアイテムは.click（）イベントをトリガーしません。

$(#sortable li).click(function(){ 
    alert('Sortable item clicked'); 
}); 

https://jsfiddle.net/1so55b0t/2/

なぜ？

---

さて、私は（「クリック」）.onする）（.clickを交換してい

そして、私の要素は、クラス.removeと閉じるボタンがあり、再び、これは新しい要素のために動作しません。

$('#sortable li').on('click','.remove',function(){ 
    $(this).parent().remove(); 
}); 

https://jsfiddle.net/1so55b0t/4/ なぜですか？

Answer 1

これを試してください：あなたはDOM内li Sを移動しているとして、それは以前にバインドクリックイベントハンドラに適用されません。削除ボタンのクリックハンドラを追加するためのコードの下に使用してください - -

$('#sortable').on('click','li .remove',function(e) { 
    e.stopPropagation(); 
    $(this).parent().remove(); 
}); 

JSFiddle Demo

$('#sortable').on('click', 'li', function(){ 
    alert('Sortable item clicked'); 
}); 

EDIT以下のような動的/新しい要素のために有用である、より良い利用のクリックイベントの代表団、

Answer 2

新しく追加された要素にもclickハンドラを追加する必要があるためです。コードを以下のように変更してください。デモを確認する - https://jsfiddle.net/1so55b0t/3/

$('#sortable').on('click', 'li', function() { 
    alert('Sortable item Clicked!'); 
}); 

Answer 3

このコードを使用することができます

$(document).on('click', '#sortable li', function() { 
 
    
 
    \t alert('Sortable item Clicked!'); 
 
    });