这个结构会一直工作吗[重复]答案

【问题标题】：Will this construct work all time [duplicate]这个结构会一直工作吗[重复]
【发布时间】：2013-08-24 23:31:53
【问题描述】：

在我的网站上，它将有产品图块，每个图块中都有一个按钮，图块将根据可用性通过 ajax 调用加载，我正在使用以下函数来初始化具有 div 的函数。这里“add_+uid”是按钮的id

$('#add_'+uid).bind("click",addFunction);
function addFunction(){

...
}

我发现上面的代码只适用于页面加载，我可以像这样使用它吗？这是 ajax 类型场景的解决方案吗？

$('#add_'+uid).click(addFunction);

如果这对这种情况没有任何建议？

【问题讨论】：

我不是 100% 确定您的要求。当元素存在时，绑定事件处理程序总是“有效”。所以是的，当您在 Ajax 响应回调中添加新元素然后调用 $('#add_'+uid).click(addFunction); 时，它将“工作”。
阅读事件委托jQuery's .on()，我建议使用类而不是将事件单独绑定到每个 id
如果'#add_'+uid不在DOM中，则需要使用on函数或delegate jQuery方法。
感谢您的所有支持，@Felix Kling 我只使用这个 $('#add_'+uid).click(addFunction);并发现它的工作..希望它适用于所有瓷砖......因为 tomarrow 我可能在页面上有 100 个瓷砖

【解决方案1】：

可以为父元素调用 jQuery on 方法。
只要父元素存在，它就会捕获给定选择器的所有事件。

.on( events [, selector ] [, data ], handler(eventObject) )

选择器：
用于过滤后代的选择器字符串触发事件的选定元素。

$('body').on('click', '#add_'+uid, function(){

});

您还可以将侦听器绑定到以add_ 开头的所有元素：

$('body').on('click', '[id^=add_]', function(){
  alert($(this).attr('id'));
});

演示：jsFiddle

【讨论】：

你应该澄清你正在使用事件委托，而 OP 不是。
@jantimon 您的解决方案是正确的，但是当我们根据我们单击的位置执行相同的功能时它会起作用，例如我们只需发出警报，它就会起作用....但是我要获取动态数据，例如图像，该图块的网址，产品ID，产品名称，产品描述，prd idf_id，...等，在这种情况下，我将不得不动态传递它们...
您可以在事件处理程序中使用this 查看我更新的答案。它总是会提醒点击元素的 Id。

【解决方案2】：

使用

$(document).on("click", '#add_'+uid, addFunction);
function addFunction(){
    ...
}

除了document，您还可以在页面上使用静态容器。

【讨论】：