您好,欢迎访问一九零五行业门户网

jQuery.triggerHandler() 函数详解

triggerhandler()函数用于在每个匹配元素上触发指定类型的事件。
此外,你还可以在触发事件时为事件处理函数传入额外的参数。
该函数的作用于trigger()函数相似,但triggerhandler()函数具有以下例外情况:
triggerhandler()不会触发执行元素的默认行为(例如链接click事件默认的跳转行为,表单submit事件默认的提交行为)。
triggerhandler()触发事件只针对jquery对象中的第一个匹配元素。
triggerhandler()触发的事件不会在dom树中冒泡,因此事件不会冒泡传递到它的任何祖辈元素。
triggerhandler()的返回值是对应事件处理函数的返回值,而不是当前jquery对象本身。
该函数属于jquery对象(实例)。
语法
jquery 1.2 新增该函数。
jqueryobject.triggerhandler( events [, extraarguments ] )
参数
参数 描述
events string类型指定的事件类型和可选的命名空间,例如click、focus、keydown.myplugin。
extraarguments 可选/object类型为事件处理函数传入的额外参数。如果要传入多个参数,请以数组方式传入。
triggerhandler()函数会为触发执行的事件处理函数传入一个默认参数,也就是表示当前事件的event对象。
参数extraarguments用于为事件处理函数传入更多额外的参数。如果extraarguments是数组形式,则每个元素都将充当函数的参数。
返回值
triggerhandler()函数的返回值为任意类型,返回触发执行的事件处理函数的返回值。
示例&说明
请参考下面这段初始html代码:
<input id="btn1" type="button" value="点击1" /> <input id="btn2" type="button" value="点击2" /> <a id="a1" href="#">codeplayer</a> <div id="log"></div>
首先,我们为上述button和<a>元素绑定事件,然后使用triggerhandler()函数直接触发事件,相应的代码如下:
var $log = $("#log"); function handler( event, arg1, arg2 ){ var html = '<br>触发元素#' + this.id + '的[' + event.type +']事件,额外的函数参数为:' + arg1 + ', ' + arg2; $log.append( html ); } var $buttons = $(":button"); // 为所有button元素的click事件绑定事件处理函数 $buttons.bind( "click", handler ); // 为所有a元素的click、mouseover、mouseleave事件绑定事件处理函数 $("a").bind( "click mouseover mouseleave", handler ); // 触发btn1的click事件 // 虽然$buttons匹配两个button元素,但只会触发第一个匹配元素的click事件 $buttons.triggerhandler("click"); /*(追加文本) 触发元素#btn1的[click]事件,额外的函数参数为:undefined, undefined */ $("#btn2").triggerhandler("click", "codeplayer"); /*(追加文本) 触发元素#btn2的[click]事件,额外的函数参数为:codeplayer, undefined */ // arg1 = "张三", arg2 = 20 $("a").triggerhandler("mouseover", ["张三", 20 ] ); /*(追加文本) 触发元素#a1的[mouseover]事件,额外的函数参数为:张三, 20 */ $("a").triggerhandler("mouseleave", { name: "张三", age: 18 } ); /*(追加文本) 触发元素#a1的[mouseleave]事件,额外的函数参数为:[object object], undefined */
运行代码(其他代码请自行复制到演示页面运行)
triggerhandler()函数还可以根据传入事件处理函数的event对象,来触发对应的事件。
var $btn1 = $("#btn1"); // 为btn1元素的click事件绑定事件处理函数 $btn1.bind( "click", function(event){ alert("click1"); }); // 为btn1元素的click事件绑定事件处理函数 // 如果传入了一个有效的额外参数,则再次触发click $btn1.bind( "click", function(event, arg1){ alert("click2"); if(arg1) $(this).triggerhandler( event ); }); // $btn1.triggerhandler( "click" ); // 调用一次click1、调用一次click2 $btn1.triggerhandler( "click", true ); // 调用两次click1、调用两次click2 此外,triggerhandler()函数还可以只触发包含指定定命名空间的事件(1.4.3+才支持命名空间)。 function a( event ){ alert( 'a' ); } function b( event ){ alert( 'b' ); } function c( event ){ alert( 'c' ); } var $btn1 = $("#btn1"); // 为btn1元素的click事件绑定事件处理函数 $btn1.bind( "click.foo.bar", a ); $btn1.bind( "click.test.foo", b ); $btn1.bind( "click.test", c ); // 触发btn1的click事件,不限定命名空间 $btn1.triggerhandler("click"); // 触发a、b、c // 触发btn1的包含命名空间foo的click事件 $btn1.triggerhandler("click.foo"); // 触发a、b // 触发btn1的包含命名空间test的click事件 $btn1.triggerhandler("click.test"); // 触发b、c // 触发btn1的同时包含命名空间foo和test的click事件 $btn1.triggerhandler("click.foo.test"); // 触发b
以上就是jquery.triggerhandler() 函数详解的详细内容。
其它类似信息

推荐信息