jQuery:动态追加元素+ .on()

Question

我有一系列 buy 类的 HREF。单击时我会覆盖它们，如下所示:

$('.buy').on('click', function (e) {
     e.preventDefault();
     var me = $(this);
     // other stuff here...

这按预期工作正常。当我动态地将更多这些链接附加到 DOM 时，问题就来了。单击这些链接时，不会捕获它们。我认为使用 .on() 方法进行绑定(bind)可以处理加载 JS 时 DOM 中不存在的项目。

不知道为什么，我似乎无法弄清楚。正如预期的那样，使用带有 .on 的标准点击捕获不起作用。

Answer 1

$(document).on('click', '.buy', function(e){
     e.preventDefault();
     var me = $(this);
     // other stuff here...
});

该事件需要委托(delegate)给静态元素，第二个参数是您希望函数运行的选择器。

您的方式虽然仍然保持不变，但不会将其附加到绑定(bind)到页面加载的静态元素。