在 jQuery 中处理按钮点击事件

在今天的文章中，我们将了解 jQuery 中的按钮 click 事件。

在 jQuery 中处理按钮 click 事件

jQuery 有一个集成的 .click() 方法，它将事件处理程序绑定到 JavaScript click 事件或在元素上调度此事件。

语法：

.click( handler )
.click( [eventData ], handler )

1. handler 是每次触发事件时执行的函数。
2. eventData 是一个对象，包含要被事件处理程序超越的数据。

此方法是前两个变体中的 .on("click", handler ) 和第三个变体中 .trigger( "click" ) 的缩写。当鼠标指针在元素上方时，click 事件被发送到元素，并且鼠标按钮被按下并启动。

任何 HTML 元素都可以接收此事件。由于 .click() 方法只是 .on("click", handler ) 的缩写，它可以用 .off("click") 分隔。

click 事件仅在这一系列事件之后调度：

1. 当鼠标指针位于元素上方时按下鼠标按钮。
2. 当鼠标指针在元素上方时释放鼠标按钮。

这通常是执行操作之前的所需顺序。如果这不是必需的，mousedown 或 mouseup 事件可能更合适。

让我们通过以下示例来理解它：

<button id="btn">Hello World!</button>

$("#btn").click(() => {
  console.log("Click event fired")
});

在上面的例子中，我们定义了 button 元素。调度 click 事件，并在单击按钮后立即执行该函数。

尝试在任何支持 jQuery 的浏览器中运行上述代码片段。它将显示以下结果：

输出：

Click event fired

在此处查看演示。