jquery添加点击事件

使用 click() 方法

通过 click() 方法直接绑定点击事件，适用于简单场景。

$("#elementId").click(function() {
    alert("元素被点击");
});

使用 on() 方法

on() 方法更灵活，支持动态元素和事件委托。

// 静态元素绑定
$("#elementId").on("click", function() {
    console.log("静态元素点击");
});

// 动态元素委托（父元素监听）
$("#parentElement").on("click", ".dynamicChild", function() {
    console.log("动态子元素被点击");
});

事件委托的优势

动态生成的元素无需重新绑定事件，适合内容频繁变化的场景。

$("body").on("click", "#laterAddedElement", function() {
    alert("后添加的元素生效");
});

传递事件参数

通过 event 对象获取点击事件的详细信息。

$(".btn").on("click", function(event) {
    console.log("坐标:", event.clientX, event.clientY);
});

移除点击事件

使用 off() 方法解绑事件。

$("#elementId").off("click"); // 移除所有点击事件
$("#elementId").off("click", specificHandler); // 移除指定处理函数

注意事项

• 选择器需唯一，避免误绑定。
• 动态元素优先使用事件委托。
• 避免重复绑定，防止内存泄漏。