jQuery 动态绑定事件 on.click 与简单绑定 click ！

作者：System 时间：2024年08月16日分类：所有,jquery 字数：632

在jQuery中，.on() 方法用于绑定事件处理程序，它可以处理由DOM未来元素引起的事件。.click() 是一个快捷方式，实质上是对 .on("click", handler) 的封装。

如果你想为未来的元素绑定点击事件，你应该使用 .on() 方法。如果你只需要为当前存在的元素绑定点击事件，你可以直接使用 .click() 方法。

以下是两种方法的示例代码：

使用 .on() 绑定点击事件：




$(document).on("click", ".myButton", function() {
    alert("按钮被点击了！");
});

在上面的代码中，.myButton 是将来会添加到DOM中的按钮的类名。当任何具有 .myButton 类的元素被点击时，会触发提供的函数。

使用 .click() 绑定点击事件：




$(".myButton").click(function() {
    alert("按钮被点击了！");
});

在上面的代码中，只有当前存在的具有 .myButton 类的元素会被绑定点击事件。如果该按钮是未来动态添加到DOM中的，上述代码不会为这个按钮绑定事件。

如果你需要同时绑定当前存在的和未来的元素，你需要使用 .on() 方法。