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

Js冒泡事件详解及阻止示例

2014-03-21 16:10 821 查看

<html> <script type="text/javascript" src="jquery-1.7.1.js"></script> <script> function ialertdouble(e) { alert('innerdouble'); stopBubble(e); } function ialertthree(e) { alert('innerthree'); stopBubbleDouble(e); } function stopBubble(e) { var evt = e||window.event; evt.stopPropagation?evt.stopPropagation():(evt.cancelBubble=true);//阻止冒泡 } function stopBubbleDouble(e) { var evt = e||window.event; evt.stopPropagation?evt.stopPropagation():(evt.cancelBubble=true);//阻止冒泡 evt.preventDefault();//阻止浏览器默认行为，这样链接就不会跳转 } $(function() { //方法一 //$('#jquerytest').click(function(event) { // alert('innerfour'); // event.stopPropagation(); // event.preventDefault(); //}); //方法二 $('#jquerytest').click(function() { alert('innerfour'); return false; }); }); </script> <div onclick="alert('without');">without <div onclick="alert('middle');">middle <div onclick="alert('inner');">inner</div> <div onclick="ialertdouble(event)">innerdouble</div> <p><a href='http://www.baidu.com' onclick="ialertthree(event)">innerthree</a></p> <p id='jquerytest'><a href='http://www.baidu.com'>innerfour</a></p> </div> </div> </html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 冒泡事件

相关文章推荐

新的分享

章节导航