jquery的冒泡和默认行为

如果在页面中重叠了多个元素，并且重叠的这些元素都绑定了同一个事件，那么就会出
现冒泡问题。

 

//HTML 页面

<div style="width:200px;height:200px;background:red;">
<input type="button" value="按钮" />
</div>

//三个不同元素触发事件
$('input').click(function () {
alert('按钮被触发了！');
});

$('div').click(function () {
alert('div 层被触发了！');
});

$(document).click(function () {
alert('文档页面被触发了！');
});

jQuery 提供了一个事件对象的方法：event.stopPropagation()；这个方法设置到需要触发
的事件上时，所有上层的冒泡行为都将被取消。

$('input').click(function (e) {
alert('按钮被触发了！');
e.stopPropagation();
});