对于JavaScript插入的链接，不会显示警报

Question

我正在使用大型代码库，我正在尝试编写一些JQuery，以便每当用户点击链接（即a标记）时，都会发出警报。这就是我写的：

$(document).ready(function() { 
    alert("hey ho!"); 
    $("a").click(function(event){ 
        alert("Hello!"); 
    }); 
});

“嘿嘿！”警报显示，所以JQuery正在工作。现在，此文件中的链接实际上在HTML代码中不，而是由其他JavaScript插入。我可以将它们作为DOM元素打印出来并在我的控制台上看到它们：

<a style="..." href="...">

它们是内部链接，当我点击它们时，它们会跳转到正确的位置。但是，没有警报。可能是什么问题？我该怎么调试呢？

Answer 1

将on与委派一起使用，以便新元素也可以接收事件：

$(document.body).on('click',"a",function(event){ 
    alert("Hello!"); 
}); 

Answer 2

本周我做了一个小提琴来演示它，回答question：

http://jsfiddle.net/KjJXf/2/

这证明了.on和.off的使用。

通过.on，您的活动会在页面中“生效”，包括可以加载的新HTML。

Answer 3

您可以在插入链接时绑定click事件，将以下代码紧跟在插入链接的代码之后。

$('a').unbind('click'); // to unbind from all previous a tags

/// bind to all again
$('a').on('click',function(){
    alert('hello');
});

如果您使用的是1.9之前的jQuery版本，那么您可以使用：

/// bind to all again
    $('a').live('click',function(){
        alert('hello');
    });