如何使用 jQuery 将参数传递给单击事件处理程序？

使用 jQuery 将参数传递给 Click 事件处理程序

使用 jQuery 时，您可能会遇到需要将参数传递给单击事件处理程序。当您需要重用该函数并在每次调用时传递不同的参数时，这尤其有用。

最初，jQuery 的 .click() 似乎不允许参数传递，如下例所示显示尝试失败：

<code class="js">$('.leadtoscore').click(add_event('shot'));

function add_event(event) {
    // Function logic
}</code>

幸运的是，这个问题有一个简单的解决方案。您可以使用 .data() 方法轻松地将参数传递给单击事件处理程序，该方法允许您将数据与 HTML 元素关联起来。以下是实现此目的的方法：

<code class="js">$('.leadtoscore').data('parameter', 'shot').click(add_event);

function add_event(event) {
    const parameter = $(event.target).data('parameter');
    // Function logic using 'parameter'
}</code>

此方法涉及在相应的 HTML 元素上设置 data 属性，然后使用 event.target.data('parameter') 语法在单击事件处理程序中访问它。

作为替代方案，jQuery 1.4.3 及更高版本引入了一种更简洁的方法将数据传递给事件处理程序。您可以直接将参数对象作为第一个参数传递给 .click()，如下所示：

<code class="js">$('.leadtoscore').click({ parameter: 'shot' }, add_event);

function add_event(event) {
    const parameter = event.data.parameter;
    // Function logic using 'parameter'
}</code>

使用这些方法中的任何一个，您都可以将参数传递给单击事件处理程序，并且在多个事件中重复使用它们。

以上是如何使用 jQuery 将参数传递给单击事件处理程序？的详细内容。更多信息请关注PHP中文网其他相关文章！