事件冒泡

事件冒泡：子级和父级绑定相同的事件，触发子级的事件，会同时触发父级的事件
事件冒泡解决方法：
1、给子级加return false;
2、给子级加e.stopPropagation()

标签默认行为：标签自身带有的行为，比如a标签的跳转，表单的自动提交
阻止默认行为：
1、给标签加return false;
2、e.preventDefault();

PS：要将事件冒泡和鼠标移入事件mouseover和mouseout区分开

案例：

（1）html

<div class="box">
<p></p>
</div>
<div class="two"></div>
<a href="#l">超链接</a>

(2)css

.box{
width: 200px;
height: 200px;
background: green;
}
.box>p{
width: 100px;
height: 100px;
background: tomato;
}
.two{
width: 200px;
height: 200px;
background: yellow;
display: none;
}

（3）jQuery

$(‘.box>p‘).click(function(e){
console.log(‘这是P‘);
$(‘.two‘).css(‘display‘,‘block‘);
// return false;
e.stopPropagation();
})
$(‘.box‘).click(function(event) {
console.log(‘这是div‘);
$(‘.two‘).css(‘display‘,‘none‘);
// return false;
event.stopPropagation();
});
$(document).click(function(event) {
console.log(‘这是document‘);
});

$(‘a‘).click(function(e) {
// return false;
e.preventDefault();
});

事件冒泡

原文：https://www.cnblogs.com/msw0803/p/11525785.html