jquery点击事件拼图

Question

这是一个包含更多信息的重复帖子...

我动态创建了一堆标签，将它们附加到一个我然后添加一个点击处理程序...

$(document).ready(function(){
    // ... code to append <a> tags to nav div        
    $("#nav a").click(function(event){ 
       alert('Clicked '+event.target.id);
       return false;
    });
});

如果我因此有 10 个标签并单击第一个标签，我会收到 10 个（十个！）警报 - 但它们都显示我实际单击的标签的 ID。

（如果我单击第 5 个标签，是的，我会收到 5 个警报 - 都带有第 5 个标签的 id...）

这里发生了什么？是因为我动态创建了标签吗？有办法避免吗？

这是创建 a 标签的代码

$(document).ready(function(){
  $.get('_7day-M2.5.xml', {}, function(xml){
    $(xml).find('entry').each(function(i){
      $('#nav').append('<a href="#" id="'+i+'">'+$(this).find("title").text()+"</a><br/>");
    });
  });
});

Firebug 输出显示没有任何奇怪的外观。

知道这里发生了什么吗？

谢谢

Answer 1

尝试使用 $("#nav > a") 作为选择器，而不是 $("#nav a")。如果这不起作用，那么只需确保将 click 事件绑定到您可能拥有的任何循环之外。例如，如果您在创建锚标记时的 $.each() 中绑定了点击事件，那么它将创建多个点击事件。