jquery单击事件

jQuery 单击事件基础语法

使用 click() 方法绑定单击事件，语法如下：

$(selector).click(function() {
  // 事件触发时执行的代码
});

示例：点击按钮弹出提示框

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

动态元素的事件委托

通过 on() 方法为动态生成的元素绑定事件，避免直接绑定失效：

$(document).on("click", ".dynamic-element", function() {
  console.log("动态元素被点击");
});

阻止事件冒泡与默认行为

使用 event.stopPropagation() 阻止事件冒泡，event.preventDefault() 阻止默认行为：

$("#link").click(function(event) {
  event.preventDefault();
  event.stopPropagation();
  console.log("链接点击被拦截");
});

事件触发与手动触发

通过 trigger() 方法手动触发单击事件：

$("#btn").trigger("click"); // 手动触发按钮点击

事件对象属性

事件处理函数中的 event 对象包含常用属性：

$("#element").click(function(event) {
  console.log("点击坐标:", event.clientX, event.clientY);
  console.log("触发元素:", event.target);
});

事件解绑

使用 off() 方法移除已绑定的单击事件：

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