jquery - 追加されたdivでjQueryのクリックが機能しない

Question

画像をクリックしたときに div を追加したいと思います。それはうまく機能し、非常によく見えます。しかし、アイテムを削除するかどうかを確認するボタンが必要になりました。「はい」ボタンでクリックイベントを実行しようとしています。何も起こらないようです。どうすればこの問題を解決できますか?

$(".trashbinPage img").one('click', function(){
    $('#deletePage').closest('tr').after('<div class="deleteMessage"><p>Weet u het zeker?</p></div>');
    $('.deleteMessage').append('<div id="wrapButtons"><div class="trashYes">Ja</div><div class="trashNo">Nee</div></div>');
});

$(".trashYes").click(function(){
    alert('hoi');
});

Answer 1

.trashYesであなたを登録してくださいon：

$('.deleteMessage').on('click', '.trashYes', function() {
    ...
});

アップデート

jQuery1.7 未満のバージョンでは、次のdelegate関数を使用する必要があります。

更新 2

Roryが私のコードの問題を指摘したので、回答を更新しました。

Answer 2

オブジェクトを追加した後、イベントをオブジェクトにバインドする必要があります。または、バインドの代わりに live() または delegate() を使用します。バインド、ライブ、デリゲートの違いについては、インターネット上に多くの記事があるはずです。

Answer 3

要素は、ページの読み込み後に追加されます。これはclick()、イベントをフックするときです。onしたがって、次のように、イベントを処理するためにデリゲートを使用する必要があります。

$(".deleteMessage").on('click', '.trashYes', function(){
    alert('hoi');
});

Answer 4

打ち間違え？.one()する必要があります.on()。