博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javascript阻止事件冒泡和浏览器的默认行为
阅读量:6215 次
发布时间:2019-06-21

本文共 1016 字,大约阅读时间需要 3 分钟。

hot3.png

在使用javascript编程时会遇到一个问题,就是当你给html添加事件时,由于浏览器默认的为冒泡型事件触发机制,所以会触发你不想触发的事件.那么通过如下的函数可以解决这个问题.[兼容IE和FF]

1.阻止事件冒泡,使成为捕获型事件触发机制.

function stopBubble(e) { //如果提供了事件对象,则这是一个非IE浏览器 if ( e && e.stopPropagation )     //因此它支持W3C的stopPropagation()方法     e.stopPropagation(); else    //否则,我们需要使用IE的方式来取消事件冒泡     window.event.cancelBubble = true; }

2.当按键后,不希望按键继续传递给如HTML文本框对象时,可以取消返回值.即停止默认事件默认行为.

//阻止浏览器的默认行为 function stopDefault( e ) {     //阻止默认浏览器动作(W3C)     if ( e && e.preventDefault )         e.preventDefault();     //IE中阻止函数器默认动作的方式     else        window.event.returnValue = false;     return false; }

那么通过下面的一段代码我们来看下函数一的效果:

 
效果测试
测试的文字,这里是样式C1,单击以冒泡的形式触发事件.

测试的文字,这里是样式C2,单击以捕获的形式触发事件.


上面的效果测试中,

函数一:IE6.0,FireFox,Chrome,Opera均有效

函数二:在IE中测试效果很好;Chrome,Opera无效,在FF中,按键时,如果在

$('#txt1').keydown(function(e){stopDefault(e);alert('你按下了键值'+e.keyCode); });

这句话打个断点在执行,可以达到效果.但是如果不打断点则没有效果,没找出具体原因,如果有知道的可以说出来大家讨论下.

转载于:https://my.oschina.net/u/3687565/blog/1554490

你可能感兴趣的文章
mybatis,sql 批量更新
查看>>
RabbitMQ学习(一):RabbitMQ要点简介
查看>>
CVonline: The Evolving, Distributed, Non-Proprietary, On-Line Compendium of Computer Vision
查看>>
treap
查看>>
P1220 关路灯
查看>>
python初学之函数嵌套与闭包
查看>>
emacs 就是个坑
查看>>
【BZOJ4819】 新生舞会(01分数规划,费用流)
查看>>
利用gulp,当引入文件改动时,版本号自动更新~
查看>>
字符串连接比较(std::unique_ptr实现)
查看>>
性能产生的十大原因
查看>>
java对象引用,对象赋值
查看>>
Android 底层系统架构图
查看>>
应用程序开发者关于MeeGo平台的2010总结
查看>>
全方位掌握 NSIS 的使用[转]
查看>>
MySQL如何利用索引优化ORDER BY排序语句
查看>>
[NOI.AC]NOI2019省选模拟赛 第二场
查看>>
日均5亿查询量,京东到家订单中心ES架构演进
查看>>
Ahjesus获取自定义属性Attribute或属性的名称
查看>>
JVM虚拟机选项:Xms Xmx PermSize MaxPermSize区别(转)
查看>>