將事件處理程序綁定到動態生成的div的問題

Question

我在警告窗口中顯示屏幕上單擊的div的ID時遇到問題。 我非常有信心這是因為控件和事件處理程序的順序被添加到頁面中，但是在嘗試不同的方法之后我無法使其工作。 不幸的是，由於從ajax get請求創建div，我無法發布可重現的代碼。

$(document).ready(function () {
    $.getJSON('ClientPortal/GetSkills', function (data) {
        var test = 'poo';
        $.each(data, function (data) {
            $('#flipContainer').append("<div class=flip id='" + this.Value + "' value='" + this.Value + "'>" + this.Text + "<//div>");
        })
    })
})

$(document).ready(function () {
    $(".flip").on('click', function () {
        alert($(this).attr("id"));
     })
})

Answer 1

嘗試這個 ：

$(document).ready(function () {
    $("#flipContainer").on("click", ".flip", function () {
        alert($(this).attr("id"));
     })
})

當DOM ready事件觸發時，你實際上必須以對現有元素進行點擊綁定為基礎......但是使用這種語法，你可以在現有元素上委托綁定，但它適用於第一個包含的另一個元素... on （用於行“選擇器”）的jQuery文檔： http ： //api.jquery.com/on/#on-events-selector-data-handlereventObject 。