Question

我正在使用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'。

Here is a working example，您会看到点击事件未应用于textbox33和textbox34

Answer 2

试一试：

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

使用.on()，您可以定义一次函数，它将针对任何动态添加的元素执行。

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

2 个答案: