您的位置:首页 > Web前端 > JavaScript

JS事件冒泡

2014-04-04 00:00 218 查看
事件冒泡: 当一个元素上的事件被触发的时候,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先元素中被触发。这一过程被称为事件冒泡;这个事件从原始元素开始一直冒泡到DOM树的最上层。

可以用JS来阻止js事件冒泡。因为浏览器的差异IE和FF的JS写法有点不一样。
IE用cancelBubble=true来阻止而FF下需要用stopPropagation方法。

<html>
<script type="text/javascript">
function aaaclick(){
alert("td click");
}
function bbbclick(evt){
alert("td click");
//用来判断浏览器
if (window.event) {  //IE浏览器
event.cancelBubble = true;
}else if (evt){               //FIREFOX浏览器
evt.stopPropagation();
}
}
function trclick(){
alert("tr click");
}

function tableclick(){
alert("table click");
}
</script>
<table width="204" onclick="tableclick()" class="tab">
<tr >
<td width="96"> </td>
<td width="96"> </td>
</tr>
<tr onclick="trclick()">
<td onclick="aaaclick()">aaaa</td>
<td onclick="bbbclick(event)">bbbbb</td>
</tr>
</table>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  JS 冒泡