章节
问答
课签
笔记
评论
占位
占位

jQuery自定义事件之triggerHandler事件

trigger事件还有一个特性：会在DOM树上冒泡，所以如果要阻止冒泡就需要在事件处理程序中返回false或调用事件对象中的.stopPropagation() 方法可以使事件停止冒泡

trigger事件是具有触发原生与自定义能力的，但是存在一个不可避免的问题： 事件对象event无法完美的实现，毕竟一个是浏览器给的，一个是自己模拟的。尽管 .trigger() 模拟事件对象，但是它并没有完美的复制自然发生的事件，若要触发通过 jQuery 绑定的事件处理函数，而不触发原生的事件，使用.triggerHandler() 来代替

triggerHandler与trigger的用法是一样的，重点看不同之处：

  • triggerHandler不会触发浏览器的默认行为，.triggerHandler( "submit" )将不会调用表单上的.submit()
  • .trigger() 会影响所有与 jQuery 对象相匹配的元素，而 .triggerHandler() 仅影响第一个匹配到的元素
  • 使用 .triggerHandler() 触发的事件，并不会在 DOM 树中向上冒泡。 如果它们不是由目标元素直接触发的，那么它就不会进行任何处理
  • 与普通的方法返回 jQuery 对象(这样就能够使用链式用法)相反，.triggerHandler() 返回最后一个处理的事件的返回值。如果没有触发任何事件，会返回 undefined

 

 

任务

?不会了怎么办
||
1
2
<!DOCTYPE html>
<html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
提交
重置代码
||

请验证，完成请求

由于请求次数过多，请先验证，完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后，能更快找到我哦～

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后，及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布

为什么input tigger focus事件传参不生效？

最赞回答 / Dr_nie
focus为原生事件，默认执行，传参接收不了，改变任意名字，就可以传入参数内容到input框中
3 回答 1273 浏览
2021-11-25

说一下自己的理解，避免踩坑

最新回答 / 莫龙吟啸
 $("input").on("focus",function(event,title) {        $(this).val(title)    });    $("#accident").on("click",function() {        alert("trigger触发的事件会在 DOM 树中向上冒泡");    });    //trigger触发focus    $("button:first").click(function() {        $("a").trigger("...
1 回答 1099 浏览
2019-04-02

为什么点击文本框聚焦会弹出窗口？focus不是不冒泡么？求解~

最赞回答 / 三千道藏
不是input元素上的focus冒泡，是通过trigger模拟触发了a标签的点击事件，点击事件向上冒泡 $("button:first").click(function() {        $("a").trigger("click");//这儿会向上冒泡至父级元素，虽然a标签并没有显示绑定事件处理函数        $("input").trigger("focus");    });
1 回答 1441 浏览
2019-03-03

triggerHandler

最赞回答 / 大山的子孙哟爱太阳
1.$("input").on("focus",function(event,title) {        $(this).val(title)    });这个是指input设置focus事件， $(this).val(title)是设置某个元素节点的value值，即获取$(this)元素节点并将title的值插入进去.2.$("button:last").click(function() {        $("a").triggerHandler("click");        $("input...
2 回答 1084 浏览
2019-03-29

这个trigger部分真的不太理解 它是做什么的 能干什么的

已采纳回答 / RDS_ray
触发事件函数，比如你点击了按钮B，B上绑着trigger按钮A的函数，那么按钮A的函数被触发
1 回答 1253 浏览
2019-03-13

为什么input不会触发冒泡？

最赞回答 / 老刘123
input明明触发了冒泡，不然你点击文本框弹出来的是什么，楼上的回答也是很奇妙
3 回答 2550 浏览
2019-04-02

没看懂啊，这个到底有啥用啊

+ 我来回答 回答最高可+2积分
3 回答 1354 浏览
2022-09-02

alert的文本是怎么传给上面的函数的title的？

最新回答 / waiting_warm
alert的文本没有传给title $("input").on("focus",function(event,title) {        $(this).val(title)    });    $("button:last").click(function() {        $("a").triggerHandler("click");        $("input").triggerHandler("focus","没有触发默认聚焦事件");    });文本输入框的内容是“没有触发默认聚焦...
1 回答 1472 浏览
2018-04-26

$(this).val(title)这里的title是什么意思呢？谢谢！

最新回答 / Chai_陌路
function里的一个参数
2 回答 2212 浏览
2018-05-17

啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊，这两章到底再讲什么啊？？

最赞回答 / _Rainy
$('#elem').on('Aaron', function(event,arg1,arg2) {    alert("自触自定义时间") });$('#elem').trigger('Aaron',['参数1','参数2'])如果把Aaron换成click等等事件 你就会觉得这个有没有一样 但是 这个Aaron你见过吗  这个东西就自定义用的 自定义的没有触发条件用这个。
3 回答 1482 浏览
2018-06-05

请问mouseenter不是不支持冒泡吗，为什么$("input").trigger("mouseenter")可以触发事件呢？

已采纳回答 / 慕盖茨7260074
在jquery的trigger源码中：ontype = type.indexOf( ":" ) < 0 && "on" + type;.....// Fire handlers on the event path i = 0; while ( ( cur = eventPath[ i++ ] ) && !event.isPropagationStopped() ) {     lastElement = cur;     event.type = i >...
1 回答 2167 浏览
2017-12-29

trigger停止冒泡的问题

已采纳回答 / qq_公纸晓黑_0
focus通过input冒泡
1 回答 1649 浏览
2017-12-29

关于trigger停止冒泡

已采纳回答 / qq_离殇莹火虫_0
上面写的这个停止冒泡是第一个button的，要是没加 e.stopPropagation()，你按第一个button是会触发事件的。比如：$("button:first").click(function(e) {        $("a").trigger("click");         e.stopPropagation();//阻止事件冒泡，按第一个按钮input标签不能聚焦        $("input").trigger("focus");    });我是针对你的问题来回答的，你直接点击a...
2 回答 2889 浏览
2017-12-08

trigger

最新回答 / WhpuEdison
没有触发就谈不到向上冒泡
1 回答 642 浏览
2017-07-25

.on("focus",function(event,title)

已采纳回答 / 青黄不一
event只是一个表示事件的参数名，可以任意定义，不过一般是用event或者e来表示。focus指的就是event，"没有触发默认聚焦事件"则是title的实例化
2 回答 3805 浏览
2017-07-14
全部 我要发布
最热 最新
只看我的

推荐课程

相关课程

手记推荐

更多

本次提问将花费2个积分

你的积分不足，无法发表

为什么扣积分？
确认 取消

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分？
确认 取消

账号登录 验证码登录

遇到问题
忘记密码

登录即同意慕课网《隐私政策》
代码语言