阻止JavaScript事件冒泡传递（cancelBubble 、stopPropagation）

时间：2021-05-25

cancelBubble在IE下有效
stopPropagation在Firefox下有效
复制代码 代码如下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml"lang="gb2312">
<head>
<title>阻止JavaScript事件冒泡传递（cancelBubble、stopPropagation）</title>
<metaname="keywords"content="JavaScript,事件冒泡,cancelBubble,stopPropagation"/>
<scripttype="text/javascript">
functiondoSomething(obj,evt){
alert(obj.id);
vare=(evt)?evt:window.event;
if(window.event){
e.cancelBubble=true;
}else{
//e.preventDefault();
e.stopPropagation();
}
}
</script>
</head>
<body>
<divid="parent1"onclick="alert(this.id)"style="width:250px;background-color:yellow">
<p>Thisisparent1div.</p>
<divid="child1"onclick="alert(this.id)"style="width:200px;background-color:orange">
<p>Thisischild1.</p>
</div>
<p>Thisisparent1div.</p>
</div>
<br/>
<divid="parent2"onclick="alert(this.id)"style="width:250px;background-color:cyan;">
<p>Thisisparent2div.</p>
<divid="child2"onclick="doSomething(this,event);"style="width:200px;background-color:lightblue;">
<p>Thisischild2.Willbubble.</p>
</div>
<p>Thisisparent2div.</p>
</div>
</body>
</html>

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章