1

リンクされた例でテキストを入力して[別の追加]リンクをクリックして生成されたアイテムの1つを削除しようとしていますが、生成されたコンテンツからjqueryがトリガーされません。関数がトリガーするが生成されたリンクからではない別のオブジェクトにイベントハンドラーをアタッチする場合、これを修正する方法はありますか？以下のコードでは、ユーザーがクラスdelLinkのリンクをクリックすると、そのリンクの周囲のdivとそのdiv内のすべての要素が削除（消去）されます。

<div class="regItm">
    <input properties...><a class="delLink" properties...>X</a>
</div>
<div class="regItm">
    <input properties...><a class="delLink" properties...>X</a>
</div>
...
...

http://jsfiddle.net/KYkJn/2/

4

3 に答える 3

3

これを試して：

$('.delLink').live('click', function(){
    alert('ohoy');
    $(this).closest('div').remove();
});

DOMにアイテムを動的に追加しているため、現在の関数（ページの読み込み状態）はそれらに適用されません。

これを回避するために、live（）関数があります。これにより、DOMの現在および将来のセレクターを確実に処理できます。

于 2012-10-23T23:01:41.277 に答える
1

http://jsfiddle.net/Cz4Cy/

 $('body').on('click', '.delLink', function() {
     alert('ohoy');
     $(this).closest('div').remove();
 });

そのような場合には、イベント委任を使用する必要があります。これにより、まだ存在しない要素のイベント ハンドラーを追加できます。

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

上記のコードは、説明のみを目的としています。ボディ、ドキュメント、またはウィンドウに委任されたイベント リスナーを追加することは避けてください。代わりに、それらをコンテナに追加してください。

于 2012-10-23T23:13:27.890 に答える
0

スクリプトが実行され、バスケットが実際に空になった瞬間にイベントをバインドします。

このようなイベントを動的コンテンツにバインドする推奨方法は、親要素でon()およびoff()メソッドを使用することです。

$('#basket').on('click', '.delLink', function(e) {
   alert('ohoy');
   $(this).closest('div').remove();
   e.preventDefault();
   return false; 
});
于 2012-10-23T23:12:10.180 に答える