将事件处理程序绑定到动态生成的div的问题

时间:2013-04-15 07:54:58

标签: javascript jquery ajax

我在警告窗口中显示屏幕上单击的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"));
     })
})

1 个答案:

答案 0 :(得分:3)

试试这个:

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

当DOM ready事件触发时,您实际上必须基于对现有元素的单击绑定...但是使用此语法,您可以在现有元素上委托绑定,但它适用于第一个元素中包含的另一个元素。 .. 请参阅on的jQuery文档(对于行“selector”):http://api.jquery.com/on/#on-events-selector-data-handlereventObject