stopPropagation()阻止事件的冒泡传递

最新推荐文章于 2023-11-14 00:41:40 发布

weixin_30877227

最新推荐文章于 2023-11-14 00:41:40 发布

阅读量131

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/jianxingjianyuan/p/6581450.html

版权

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script src="js/jquery.js"></script>
</head>

<body>
<div style="height:300px;">
   <p>段落文本内容
       <input type="button" value="点击" />
   </p>
</div>
</body>

<script type="text/javascript">

// 为所有div元素绑定click事件
$("div").click( function(event){
   alert("div-click");
} );

//为所有p元素绑定click事件
$("p").click( function(event){
   alert("p-click");
   event.stopPropagation();
} );

//为所有button元素绑定click事件
$(":button").click( function(event){
    alert("button-click");
   // 阻止事件冒泡到DOM树上
   event.stopPropagation(); // 只执行button的click，如果注释掉该行，将执行button、p和div的click
} );

</script>
</html>