使用 jQuery on() 将事件处理程序绑定到 click 事件将不适用于未来的元素

Question

我正在尝试为未来元素的单击事件附加事件处理程序。 这是代码：

jQuery("#container").on("click", ".betslip_row .delete a", function(){
console.log(jQuery(this).data("outcomeId"));
});

每次将新投注添加到投注单时，都会刷新（重新加载）。这就是我选择“#container”的原因。

这是链接：

http://bit.ly/1coBBIa

1. 在控制台上运行代码
2. 在投注单中添加一些投注
3. 点击 (x) 符号一一删除

它应该在控制台上打印每个已删除赌注的“结果 ID”。但事实并非如此。这段代码有错误吗？

提前感谢您的帮助。

编辑：

如果您在控制台上运行下面的代码，您可以在单击文档的任何位置看到目标元素及其内容，除了 (x) 下注删除选项。

jQuery(document).on('click', function(e){ console.log(e.target); }); 

(x) 单注删除有什么问题？为什么它不会触发事件或为什么我无法捕获事件？

Answer 1

为了满足动态元素的点击，您可以执行以下操作：

        $(document).on('click', 'div.future-element-class-name', function () {
            // print object to console
            console.log($(this));
        });