防止事件冒泡

冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件。

jQuery对DOM的事件触发具有冒泡特性。有时利用这一特性可以减少重复代码,但有时候我们又不希望事件冒泡。这个时候就要阻止jQuery.Event冒泡。

jQuery.Event的文档中的开头得知,jQuery.Event对象是符合W3C标准的一个事件对象,同时jQuery.Event免去了检查兼容IE的步骤。

1、jQuery.Event提供了一个非常简单的方法来阻止事件冒泡:event.stopPropagation();

————————————————————————————————-

js:

<script type=”text/javascript”>
$(function(){
$(document).click(function(){
alert(111);
$(“#div1″).hide();
});
$(‘#btn1′).click(function(){
$(‘#div1′).toggle();
})
});
</script>

html:

<input id=”btn1″ type=”button” value=”显示”>
<div id=”div1″></div>

————————————————————————————————-

点击“显示”按钮看,都会触发alert(111);

为了防止触发document。

————————————————————————————————-

js:

<script type=”text/javascript”>
$(function(){
$(document).click(function(){
alert(111);
$(“#div1″).hide();
});
$(‘#btn1′).click(function(event){
$(‘#div1′).toggle();

//jQuery.Event提供了一个非常简单的方法来阻止事件冒泡:event.stopPropagation();
event.stopPropagation();   // 同等       return false;
})
});
</script>

————————————————————————————————-

2、一个更简单的方法阻止事件冒泡:return false;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值