<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery-1.8.0.min.js"></script>
</head>
<body>
<div style="width: 300px;height: 300px;background-color: aqua">
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>
</div>
</body>
<script type="text/javascript">
$(document).ready(function(){
/*点击div时，body绑定的事件也被执行，*/
$("body").bind("click",bodyHandler);
$("div").bind("click",divHandler);
$("div").bind("click",divHandler2);
})
function divHandler(event){
conlog(event)
event.stopPropagation();/*阻止父级body的事件发生，*/
//event.stopImmediatePropagation();/*阻止其他所有的事件发生*/
}
function bodyHandler(event){
console.log("hello");
conlog(event)
}
function divHandler2(event){
console.log("hello");
conlog(event)
}
function conlog(event){
console.log(event);
}
</script>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery-1.8.0.min.js"></script>
</head>
<body>
<div style="width: 300px;height: 300px;background-color: aqua">
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>
</div>
</body>
<script type="text/javascript">
$(document).ready(function(){
/*点击div时，body绑定的事件也被执行，*/
$("body").bind("click",bodyHandler);
$("div").bind("click",divHandler);
$("div").bind("click",divHandler2);
})
function divHandler(event){
conlog(event)
event.stopPropagation();/*阻止父级body的事件发生，*/
//event.stopImmediatePropagation();/*阻止其他所有的事件发生*/
}
function bodyHandler(event){
console.log("hello");
conlog(event)
}
function divHandler2(event){
console.log("hello");
conlog(event)
}
function conlog(event){
console.log(event);
}
</script>
</html>