triggerHandler()
为一个事件执行附加到元素的所有处理程序。
.triggerHandler(eventType[, extraParameters ])
- eventType类型: String。以后包含JavaScript事件类型的字符串,比如
click
或submit
。 - extraParameters类型: Array 或者 PlainObject传递给事件处理程序的额外参数。
.triggerHandler(event[, extraParameters ])
- event类型: Event。一个
jQuery .Event
对象. - extraParameters类型: Array or PlainObject传递给事件处理程序的额外参数。
.triggerHandler(eventType)
可以执行所有jQuery绑定的事件类型的处理函数。它同样可以执行元素上调用的on{eventType}()
类型的任何方法(注:例如,元素上onclick
等方法)。这个方法的行为与.trigger()
相似,不同之处有如下几点:
.triggerHandler("event")
方法被触发时不会调用元素上的.event()
。这意味着在表单上触发.triggerHandler("submit")
将不会调用表单上的.submit()
。(注:可以理解为.triggerHandler()
方法并不会触发事件的默认行为。(例如,表单提交)。).trigger()
会影响所有与 jQuery 对象相匹配的元素,而.triggerHandler()
仅影响第一个匹配到的元素。- 使用
.triggerHandler()
触发的事件,并不会在 DOM 树中向上冒泡。如果它们不是由目标元素直接触发的,那么它就不会进行任何处理。 - 与普通的方法返回 jQuery 对象(这样就能够使用链式用法)相反,
.triggerHandler()
返回最后一个处理的事件的返回值。如果没有触发任何事件,会返回undefined
。
若想了解更多关于本方法的信息,请参阅.trigger()
方法。
例子
如果您使用.triggerHandler()触发 focus 事件,那么它只会触发绑定了该事件的处理函数,而浏览器的默认 focus 动作是不会被触发的。
<!DOCTYPE html> <html> <head> <script src="https://www.lanmper.cn/static/js/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>