JQuery 提供了兩種方式來阻止事件冒泡。
方式一:event.stopPropagation();
$("#div1").mousedown(function(event){
event.stopPropagation();
});
方式二:return false;
$("#div1").mousedown(function(event){
return false;
});
但是這兩種方式是有區別的。return false 不僅阻止了事件往上冒泡,而且阻止了事件本身。event.stopPropagation() 則只阻止事件往上冒泡,不阻止事件本身。
給checkbox增加阻止事件冒泡
$("input[type='checkbox']").click(function(e){
e.stopPropagation();
});
代碼示例:
$(function(){
$('.clickPic').click(function(){
$(this).children('.bigpic').attr('src','bg0000012112126.png');
$(this).children('.del').css('display','block');
})
$('.del').click(function(event){
event.stopPropagation();
$('.bigpic').attr('src','bg0000012112125.png');
$(this).css('display','none');
})
})