js 阻止事件冒泡的两种方式的方法实例

最新推荐文章于 2023-10-25 13:58:14 发布

pepe_泡泡

最新推荐文章于 2023-10-25 13:58:14 发布

阅读量945

点赞数 1

分类专栏： JS&jQuery

本文链接：https://blog.csdn.net/zhai_pei_pei/article/details/9157279

版权

JS&jQuery 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
</head>
<script type="text/JavaScript">
/*阻止父级dom 事件冒泡*/
function stopPropagation(e) {
alert('onclick button');
e = e || window.event;
if(e.stopPropagation) { //W3C阻止冒泡方法
e.stopPropagation();
} else {
e.cancelBubble = true; //IE阻止冒泡方法
}
}

/* 阻止默认事件冒泡 */
function stopDefault( e ) {
var text = document.getElementById("text");
if(text.value.length == 0){
e = e || window.event;
//阻止默认浏览器动作(W3C)
if ( e && e.preventDefault )
e.preventDefault();
//IE中阻止函数器默认动作的方式
else
window.event.returnValue = false;
alert('input is null');
return false;
}
}
</script>
<body>

<div onClick="alert('out DIV');">
<div onClick="alert('inner DIV');">
<input type="button" value="click" onClick="stopPropagation();"/>
</div>
</div>


<form method="post" action="http://www.baidu.com/" >
<input type="text" id="text" value=""/>
<input type="submit" value="submit" onClick="stopDefault();";/>
</form>
</body>
</html>

pepe_泡泡

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js 阻止事件冒泡的两种方式的方法实例

/*阻止父级dom 事件冒泡*/ function stopPropagation(e) {alert('onclick button');e = e || window.event;if(e.stopPropagation) { //W3C阻止冒泡方法e.stopPropagation();} else {e.cancelBubble = true; //IE阻止
复制链接

扫一扫