<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery - Start Animation</title>
<script type="text/javascript" src="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="#" 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才正常！
js冒泡事件示例
时间： 2024-10-11 18:17:12