Javascript 单击链接时调用函数，即使该链接是新添加的

通常，如果我想在单击链接时调用函数，我会这样做：

$('a').click(function() {
    //stuff
});

但是，即使元素是新添加的，我也需要调用这个函数。比如说,

$('a').click(function() {
    //stuff
});
$(document.body).append($('<a href="http://example.com">This is an example</a>'))
//now when I click that example link, the function isn't called!

$（'a'）。单击（函数（）{
//东西
});
$（document.body）.append（$（“”））
//现在，当我单击该示例链接时，该函数没有被调用！

如何创建适用于所有链接的函数？我无法控制添加新链接的代码，因此我不能在添加新链接时设置其

onclick

---

使用事件委派注册动态添加元素的事件，使用

---

演示：

您需要使用

.on（）

委派单击事件，如：

$(document).on('click', 'a', function(){...});

根据以下文件：

事件处理程序仅绑定到当前选定的元素；他们 在代码调用.on（）时页上必须存在。 要确保元素存在并且可以选择，请执行事件 在文档就绪处理程序中为 页面上的HTML标记。如果新的HTML被注入到页面中， 选择元素并在创建新HTML后附加事件处理程序 放入页面中

请注意，使用

$（document）

被认为是最糟糕的例子，您希望尽可能在DOM中使用更接近的元素

在文档顶部附近附加许多委托事件处理程序 树可能会降低性能。每次事件发生时，jQuery都必须 将该类型的所有附加事件的所有选择器与 从事件目标到事件顶部的路径中的元素 文件。为获得最佳性能，请在文档中附加委派事件 尽可能靠近目标元素的位置。避免过度 使用document或document.body处理大型服务器上的委托事件 文件

$(document).on('click', 'a', function(){...});