jQuery | triggerHandler() 方法

triggerHandler() 方法是 jQuery 中用来触发指定的事件并返回事件处理函数的执行结果的方法。与 trigger() 方法不同的是，triggerHandler() 方法仅触发当前元素上的事件处理函数，不会触发同一事件类型的其他元素上的事件处理函数。

语法

.triggerHandler(eventType [, extraParameters])

参数说明：

• eventType：要触发的事件类型，可以是字符串形式指定的一个或多个事件类型。
• extraParameters：可选，传递到事件处理函数中的额外参数。

返回值： 如果指定事件类型的元素上有事件处理函数，则返回最后一个事件处理函数的返回值，否则返回 undefined。

示例

触发元素上绑定的事件处理函数并返回执行结果

以下示例中，我们使用 triggerHandler() 方法触发 <button> 元素上绑定的 click 事件处理函数，并将其返回值打印到控制台中。

<button id="testBtn">点击我触发事件</button>

<script>
  $("#testBtn").on("click", function() {
    return "click事件被触发了";
  });
  
  var result = $("#testBtn").triggerHandler("click");
  console.log(result); // 输出：click事件被触发了
</script>

传递额外参数给事件处理函数

以下示例中，我们使用 triggerHandler() 方法传递一个额外参数给 CustomEvent 事件处理函数，并将其返回值打印到控制台中。

<button id="testBtn">点击我触发事件</button>

<script>
  $("#testBtn").on("CustomEvent", function(event, param) {
    return `CustomEvent事件被触发了，参数为：${param}`;
  });
  
  var result = $("#testBtn").triggerHandler("CustomEvent", ["Hello World"]);
  console.log(result); // 输出：CustomEvent事件被触发了，参数为：Hello World
</script>

注意事项

• 由于 triggerHandler() 方法不会触发同一事件类型的其他元素上的事件处理函数，所以它的性能要优于 trigger() 方法，特别是在文档中包含大量事件处理函数的情况下。
• 在使用 triggerHandler() 方法时，需要注意它并不会模拟默认事件，如果需要模拟默认事件，可以使用 trigger() 方法。
• 如果需要同时触发元素上绑定的事件处理函数和默认事件，可以使用 trigger() 方法，并将 return false; 或 event.preventDefault(); 添加到事件处理函数中以防止默认事件发生。
• 如果需要触发同一事件类型的所有元素上的事件处理函数，可以使用 trigger() 方法，并将事件类型作为第一个参数，例如：$("input[type='text']").trigger("change");