javascript - JQuery - 附加链接不起作用

Question

我使用 Jquery 1.3 和 PHP 创建了一个动态列表选择器脚本，它发送一个 JSON AJAX 请求并返回一个项目列表以供选择。 AJAX 调用完美地返回了一个项目数组，我使用 Jquery 将它们作为无序列表附加到空容器 DIV 中。该过程的这一部分按预期工作。

问题来自这样一个事实，即从该项目列表中，我将它们绘制为链接，其点击由 rel 属性处理。这是一个例子:

<a rel="itemPick" id="5|2" href="#">This is the link</a>

JQUERY 处理程序如下所示:

$('a[rel=itemPick]').click(function () { code here... });

这些链接和点击处理程序在页面加载时工作正常，但当它们附加到容器 DIV 时，点击事件不会被拾取。我不想再次刷新整个 HTML 页面，那么除了 append() 之外我还需要做些什么来让 JQUERY 识别新添加的链接吗？

Answer 1

当您使用 jQuery.click 方法时，它会查找页面上当前存在的所有“a”元素。然后，当您添加一个新的“a”元素时，它不知道该点击事件处理程序。

因此，jQuery 中有一个新的事件模型，允许您将函数绑定(bind)到所有当前和 future 的元素，称为 Live Events。 .您可以像使用普通事件绑定(bind)一样使用实时事件，但它们将适用于所有 future 指定的元素。因此，您只需将绑定(bind)逻辑切换为:

$('a[rel=itemPick]').live('click', function () {
    //code here...
})