使用jquery将事件附加到将来的元素

Question

我正在使用jquery 1.8，当用户点击带有类下拉切换的某个区域时，必须显示弹出窗口。我在第一次加载页面时使用on附加了事件。

这是

$('.dropdown-toggle').on("click", function (e) {
console.log("dropdown toggle called");
$(this).next('.dropdown').toggle();
});
$(document).on("click", function (e) {
var target = e.target;
console.log("click toggle called");
if (!$(target).is('.dropdown-toggle') && !$(target).parents().is('.dropdown-toggle')) {
$('.dropdown').hide();
}
});

我发现第二个事件适用于将来添加的元素，但第一个事件不适用于稍后添加的下拉菜单，只有“click toggle called”会在控制台中打印，但对于那些在启动时添加的元素都会“点击”切换称为“和”下拉切换，称为“打印。

这里有什么问题？是否仅适用于未来元素的文档，还是可以应用于类或其他元素，以便它们适用于未来的元素？如果不是解决方案是什么？

Answer 1

您可以将委托与.on()一起使用。通过这种方式，它将监听document中的单击（它也可以是元素的父元素，只要它在运行事件处理程序时存在），当触发时查找指定为元素的参数的元素的。对（）

试试这个：

$(document).on("click", '.dropdown-toggle', function (e) {