-1

私はリストを持っています

<ul id="list">
    <li> element one <span class="remover">X</span></li>
    <li> element two <span class="remover">X</span></li>
</ul>

このリストは動的に追加されます

<input type="text" id="adder">
<button id="add">Add</button>

<script>
    $("#add").click(function(){
        $("#list").append('<li>'+$("#adder").val()+' <span class="remover">X</span></li>');
    });
</script>

しかし、問題はこの部分です

<script> 
    $(".remover").click(function(){
        $(this).parent().remove();
    });
</script>

削除はstatic added itemsで完全に機能しますが、新しい追加アイテムに関しては、クリックしても何も起こらず、関数をトリガーしません

4

3 に答える 3

2

私はお勧めします：

$('#list').on('click', '.remover', function(e){
    $(this).parent().remove();
});

JS フィドルのデモ。

参考文献:

于 2013-11-23T23:38:39.583 に答える
1

あなたが使用する必要があります

on('click',function(){})

いいえ

.click()

参照: http://api.jquery.com/on/

click は document 内の現在の項目に関連し、 on は document に追加される将来の項目に関連しますが、たとえば将来追加される要素の親など、ドキュメントに既に存在するものに対しては常に on を使用する必要があります。何かのようなもの

$("#parent").children("li").children('.remover').on("click",function(){bla bla bla;});
于 2013-11-23T23:26:45.497 に答える
1

リストでクリック関数を呼び出し、次のようにリムーバーをターゲットとして設定します。

$( '#list' ).on( 'click', '.remover', function (e) {
    $(e.target).parent().remove();
});

クリック イベントを直接設定することはできません。ページに追加されない要素に設定する必要があります。

于 2013-11-23T23:41:00.953 に答える