< meta charset ="utf-8" > < title > jquery的trigger和triggerHandler区别 </ title > < script src ="http://code.jquery.com/jquery-1.10.2.js" ></ script > </ head > < input type ="checkbox" id ="checkbox1" />< input type ="text" id ="test1" /> &nbsp; < input type ="checkbox" id ="checkbox2" />< input type ="text" id ="test2" /> < input type ="button" value ="trigger" id ="bnt" onclick ="bntClick()" /> < input type ="button" value ="triggerHandler" id ="bnt2" onclick ="bntClick2()" /> </ body > < script > $( document ).ready( function () { $( " #checkbox1 " ).bind( " click " , function (){ $( " #test1 " ).val( " www.baidu.com " ); $( " #checkbox2 " ).bind( " click " , function (){ $( " #test2 " ).val( " www.baidu.com " ); function bntClick(){ $( " input[type='checkbox'] " ).trigger( " click " ); function bntClick2(){ $( " input[type='checkbox'] " ).triggerHandler( " click " ); </ script > </ html >

显示的页面如下

1.点击两个checkbox分别会填充各自右边的输入框。这点不用多做解释,大家一看都知道。

2.点击trigger按钮,显示如下:

点击triggerHandler按钮,如下

对比,可知

triggerHandler不会触发浏览器默认事件 -因为checkbox的勾并没有打上,这打勾就是浏览器默认事件;

triggerHandler只触发jQuery对象集合中第一个元素的事件处理函数 -第二个输入框并没有触发事件;

API的第三点我只是意会,感觉说不清楚,后期理解深刻了再做补充。。。