首页 > 代码库 > js冒泡事件示例
js冒泡事件示例
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery - Start Animation</title> <script type="text/javascript" src="http://www.mamicode.com/js/jquery/jquery-1.7.2.min.js"></script> <script type="text/javascript"> $(function () { $("div").css({ border: "1px solid red" }); $("#div1").css({ height: "500px", width: "500px" }); $("#div2").css({ height: "300px", width: "300px" }); $("#div3").css({ height: "100px", width: "100px" }); }); </script> </head> <body> <div id="div1"> <a href="http://www.mamicode.com/#" onclick="click_one(event);">测试冒泡</a> <div id="div2" onclick="click_two(event);"> <div id="div3" onclick="click_thi(event);"> </div> </div> </div> </body> <script type="text/javascript"> function click_one(event) { event.stopPropagation(); alert("div1"); } function click_two(event) { event.stopPropagation(); alert("div2"); } function click_thi(event) { event.stopPropagation(); alert("div3"); }</script></html>
注意：
1. 火狐浏览器必须传递event参数
2. a标签的<href="javascript:click_one(event);">写法不能传递event对象，只有onclick才正常！
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。