5

削除するためのリンクを使用して、順序付きリストに新しい要素を追加しようとしています:

$('#list ol').append('<li>' + label + ' <a href="#remove_'+id+'">[remove]</a></li>');

しかし、これは機能していません:

$('a[href^="#remove"]').on('click', function(event){
    alert('Removing: '+$(this).attr('href').substr(8));
    event.preventDefault();
});

理由はありますか？

4

2 に答える 2

8

新しい要素を jQuery タグでラップし、その時点でイベント ハンドラーを適用します。これは、エレメントがすでに DOM に挿入された後で、多少複雑な jQuery セレクターを使用してイベント ハンドラーを割り当てるよりも、クリーンで効率的な方法です。

//this line will create your element in memory, but not insert it to the DOM
var newElmt = $('<li>' + label + ' <a href="#remove_'+id+'">[remove]</a></li>');

//you can apply jQuery style event handlers at this point
newElmt.on('click',function(e) {

    alert('Removing: '+$(this).attr('href').substr(8));
    event.preventDefault();
});

//insert the element as you were before
$('#list ol').append(newElmt);
于 2012-08-09T17:15:47.430 に答える
0 
$('#list').on('click', 'a[href^="#remove"]', function(event){
    alert('Removing: '+$(this).attr('href').substr(8));
    event.preventDefault();
});

動的に追加するため、デリゲートハンドラーとしてli使用するデリゲートイベント処理が必要です。.on()

于 2012-08-09T17:17:15.720 に答える