关于 .triggerHandler()

来源：

杨洋1989

2016-06-09

w3c标准文档中有注明“.trigger() 会操作 jQuery 对象匹配的所有元素，而 .triggerHandler() 只影响第一个匹配元素。”而page1页面有两个class为component的元素，说明该方法只对第一个元素起作用。如何解释？

写回答

1回答

Lyn

2016-06-13

你这个摘出来的话理解应该是不太正确的。以下是 http://www.w3school.com.cn/jquery/event_triggerhandler.asp 中的部分原文

// triggerHandler() 方法触发被选元素的指定事件类型。但不会执行浏览器默认动作，也不会产生事件冒泡。
// triggerHandler() 方法与 trigger() 方法类似。不同的是它不会触发事件（比如表单提交）的默认行为，而且只影响第一个匹配元素。

按这个理解，如果DOM结构是（如果要测试代码，注意引入 jquery.js 文件）

<body>
<div class="parent">
    <div class="child"></div>
    <div class="child"></div>
</div>
</body>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    $('div,body').on('click',function(){ console.log(this,'我被触发了')});
</script>

测试代码是：

$('div').trigger('click'); // 所有 div 都被触发了，并且 body 也会有 click 事件，最终返回 所有匹配的元素[ DIV.parent , DIV.child , DIV.child ]
// - DIV.parent 被触发
// - - BODY 被触发
//
// - DIV.child[0] 被触发
// - - DIV.parent 被触发
// - - - BODY 被触发
//
// - DIV.child[1] 被触发
// - - DIV.parent 被触发
// - - - BODY 被触发

代码是：

$('div').triggerHandler('click'); // 第一个DIV.parent 被触发了，返回 undefined
// 没有然后了，这个东西不向上传播，不会去触发 body 的 click 事件

Web App用组件方式开发全站

用HTML5/CSS3/JS流行技术，实现移动端可视化数据报告

3164 学习 · 516 问题

查看课程

相似问题

关于 .triggerHandler('onLeave')

回答 4

关于triggerHandler和trigger的区别，老师有点儿没讲到

回答 1

关于this的使用

回答 1

提个关于原生JS滚动执行动画的问题

回答 4

jquery的on方法中绑定的onload事件

回答 1

打开慕课网App查看更多内容