什么是事件的冒泡
事件的冒泡是指,父子元素同时监听同一个事件,当触发子元素的事件的同时,同一个事件也被传递到了父元素的事件里去了。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
span{
100px;
border: 1px solid blue;
background: red;
margin:10px;
}
div{
200px;
height:100px;
border:1px solid green;
background: green;
}
</style>
<!--引入jQuery库-->
<script type="text/javascript" src="../lib/jquery-1.7.2.js"></script>
<script type="text/javascript">
$(function(){
$("div").click(function(){
alert("haha");
});
$("span").click(function(){
alert("xixi");
});
});
</script>
</head>
<body>
<div>
外层div<br>
<span>内层span</span> <br>
外层div
</div>
</body>
</html>
如果想阻止事件冒泡,就在子元素的绑定事件函数中加入return false。