jquery - 处理 jQuery 中 append 元素的单击事件

Question

我使用以下方法在页面中生成了一些元素。例如，

$("#button"+caption).click(function(){
        var firstDisplay = '<div id="firstDisp'+caption+'"><ul>';
        for(var i=0;i<parents.length;i++){
            firstDisplay=firstDisplay+'<li class="fClick">'+parents[i]+'</li>';
        }
        firstDisplay=firstDisplay+'</ul></div>';
        $(firstDisplay).dialog();
});

当我为“fClass”创建 onclick 事件时，如下所示:

$(".fClick").click(function(){
    alert("hey!");
}); 

这不起作用!但是，如果我将 onclick 函数放在另一个函数中，就在 .dialog() 之后，它就可以工作!我以这种方式创建了很多元素，因此我无法将所有 onclick 事件放在一个方法中。有没有办法解决？我的 .append 方法也遇到同样的问题。

Answer 1

根据您使用的 jQuery 版本将其更改为 .on 或 .delegate。

自 jQuery 1.7+ 起

$(document).on('click', '.fClick', function(){ 
    alert("hey!");
}); 

对于较旧的 jQuery 版本，请使用委托(delegate)

$(document).delegate('.fClick', 'click', function(){
    alert("hey!");
});