文档章节

javascript preventDefault与stopPropagation

思悟修
 思悟修
发布于 2016/05/23 18:19
字数 209
阅读 42
收藏 0

一、preventDefault

其阻止默认行为的发生而发生其他的事件,例如:阻止<a> onclick而触发的超链接

<a href="http://www.baidu.com" id="stopLink">百度</a>
<script type="text/javascript"> 
var test=document.getElementById("stopLink");
test.onclick= function(e){
   alert(this.href);
   stopDefault(e);
}
function stopDefault( e ) { 
if ( e && e.preventDefault )e.preventDefault(); 
   else 
   window.event.returnValue = false; 
    return false; 
} 
</script> 
-----------------------
结果:将不会自动跳转到百度首页,默认跳转事件被阻止执行

二、stopPropagation

子元素触发事件阻止事件冒泡引发父元素事件触发

<div id="parent" style="width:250px;background-color:yellow" onclick="alert(this.id)">
  <div id="son" style="width:200px;background-color:green" onclick="stopUp(this,event)">
   son
  </div>
</div>
<script type="text/javascript">
  function stopUp(obj,evt){
    alert(obj.id);
    var e=evt?evt:window.event;
    if(window.event){
     e.cancelBubble=true;
    }else{
     e.stopPropagation();
    }
 }
</script>
---------------------------
结果:点击son时parent click事件不会被触发,son阻止了冒泡传递

 

© 著作权归作者所有

思悟修
粉丝 5
博文 59
码字总数 43362
作品 0
杭州
私信 提问
preventDefault 和 stopPropagation 的区别

版权声明:本文首发 http://asing1elife.com ,转载请注明出处。 https://blog.csdn.net/asing1elife/article/details/82620083 preventDefault 和 stopPropagation 的区别 在使用 JS 阻止默......

asing1elife
2018/09/11
0
0
JS_stopPropagation, preventDefault 和 return false

因为有父, 子节点同在, 因为有监听事件和浏览器默认动作之分. 使用 JavaScript 时为了达到预期效果经常需要阻止事件和动作执行. 一般我们会用到三种方法, 分别是 stopPropagation(), prevent...

喵王不瞌睡
2014/12/07
53
0
为移动端网页构造快速响应按钮

背景 在谷歌,我们不断地推测手机网页应用的可能性。像HTML5这样的技术使我们网页版的应用以及运行在手机设备上的原生应用。而这些技术的成就之一就是我们开发了一种新的创建按钮的方法,使按...

kenzone
2013/11/06
3.1K
13
跨浏览器的javascript事件和对象的封装

跨浏览器的事件处理程序 DOM0级处理事件 将一个函数赋值给一个事件处理程序属性 事件流: 冒泡阶段 使用: 1、为元素增加事件: 2、删除事件: DOM2级事件处理程序 两个方法: 和 三个参数:...

小婉
06/11
0
0
深度解析JavaScript事件对象

这篇文章主要介绍了JavaScript事件对象,结合实例形式深入分析了javascript DOM、IE及其他浏览器相关事件对象操作技巧与注意事项,写的十分的全面细致,具有一定的参考价值,对此有需要的朋友可...

前端攻城小牛
01/16
424
1

没有更多内容

加载失败,请刷新页面

加载更多

CQRS与AXON

CQRS 看了蛮多文章,只会CRUD,却不懂CQRS,CQRS是遵循DDD思想而产生的一种模式,Command and Query Responsibility Segregation 命令与查询隔离。查询就直接通过正常的模式service调dao层。...

无极之岚
28分钟前
4
0
OSChina 周三乱弹 —— 欢迎你来做产品经理

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @巴拉迪维 :10多次劲歌金曲获奖,更多叱咤歌坛排名,黎明才应该是四大天王之首,只可惜拍的电影太少。单曲循环一个多月的歌,力荐 《无名份的...

小小编辑
43分钟前
78
5
500行代码,教你用python写个微信飞机大战

这几天在重温微信小游戏的飞机大战,玩着玩着就在思考人生了,这飞机大战怎么就可以做的那么好,操作简单,简单上手。 帮助蹲厕族、YP族、饭圈女孩在无聊之余可以有一样东西让他们振作起来!...

上海小胖
今天
8
0
关于AsyncTask的onPostExcute方法是否会在Activity重建过程中调用的问题

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 本文链接:https://blog.csdn.net/XG1057415595/article/details/86774575 假设下面一种情况...

shzwork
今天
7
0
object 类中有哪些方法?

getClass(): 获取运行时类的对象 equals():判断其他对象是否与此对象相等 hashcode():返回该对象的哈希码值 toString():返回该对象的字符串表示 clone(): 创建并返此对象的一个副本 wait...

happywe
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部