当前位置: 首页>>代码示例 >>用法及示例精选 >>正文

JQuery .triggerHandler()用法及代码示例


用法 
.triggerHandler( eventType [, extraParameters ] ) => Object

说明：执行附加到事件元素的所有处理程序。

  • 添加的版本：1.2.triggerHandler( eventType [, extraParameters ] )

    • eventType
      类型：String
      包含 JavaScript 事件类型的字符串，例如 click 或 submit 。
    • extraParameters
      类型：Array 或 PlainObject
      要传递给事件处理程序的附加参数。

  • 添加的版本：1.3.triggerHandler( event [, extraParameters ] )

.triggerHandler( eventType ) 为事件类型执行所有与 jQuery 绑定的处理程序。它还将执行在元素上找到的任何名为on{eventType}() 的方法。此方法的行为类似于 .trigger() ，但有以下异常：

  • .triggerHandler( "event" ) 方法不会在触发它的元素上调用 .event()。这意味着表单上的.triggerHandler( "submit" ) 不会调用表单上的.submit()。
  • .trigger() 将对 jQuery 对象匹配的所有元素进行操作，而 .triggerHandler() 仅影响第一个匹配的元素。
  • .triggerHandler() 触发的事件不会在 DOM 层次结构中冒泡；如果它们没有被目标元素直接处理，它们什么也不做。
  • .triggerHandler() 不是返回 jQuery 对象(以允许链接)，而是返回它导致执行的最后一个处理程序返回的任何值。如果未触发任何处理程序，则返回 undefined

有关此方法的更多信息，请参阅 .trigger() 的讨论。

例子：

如果您在焦点事件上调用 .triggerHandler() - 不会触发浏览器的默认焦点操作，只会触发绑定到焦点事件的事件处理程序。

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>triggerHandler demo</title>
  <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head>
<body>
 
<button id="old">.trigger( "focus" )</button>
<button id="new">.triggerHandler( "focus" )</button><br><br>
 
<input type="text" value="To Be Focused">
 
<script>
$( "#old" ).click(function() {
  $( "input" ).trigger( "focus" );
});
$( "#new" ).click(function() {
  $( "input" ).triggerHandler( "focus" );
});
$( "input" ).focus(function() {
  $( "<span>Focused!</span>" ).appendTo( "body" ).fadeOut( 1000 );
});
</script>
 
</body>
</html>

演示：

相关用法


注：本文由纯净天空筛选整理自jquery.com大神的英文原创作品 .triggerHandler()。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。