使用jquery为动态创建的特定元素添加事件侦听器

我正在使用jquery创建动态元素，并尝试绑定元素的侦听器。 通过绑定侦听器使用

$('#div11').on('click',$('#textbox31'),function(e){showPopupImage(e);}); $('#div11').on('click',$('#textbox32'),function(e){alert('hi');}); 

函数，即使我指定要绑定的特定字段，它也会向后代添加监听器。

请告诉我处理我的情况的好方法。

Answer 1

问题是您没有为on函数指定正确的参数。 如果查看JQuery文档，则使用以下函数重载：

.on（events [，selector] [，data]）

您指定的部分不正确是selector参数。 此参数需要选择器字符串，而不是JQuery对象。

以下将有效：

 $('#div11').on('click','#textbox31',function(e){showPopupImage(e);}); $('#div11').on('click','#textbox32',function(e){alert('hi');}); 

请注意，我已将$('#textbox31')替换$('#textbox31') '#textbox31' 。

这是一个工作示例 ，您将看到click事件未应用于textbox33和textbox34

Answer 2

试试吧 ：

 $('#div11').on('click', '#textbox31',function(e){ showPopupImage(e); }); $('#div11').on('click', '#textbox32', function(e) { //do something }); 

使用.on（）可以定义一次函数，它将为任何动态添加的元素执行。