<
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"
/>
<
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的第三点我只是意会,感觉说不清楚,后期理解深刻了再做补充。。。