如何让jQuery仅触发精确绑定事件

Question

我有一个场景，我必须将click事件绑定到外部和内部div，但有一个问题，我点击内部div它将触发2点击事件，包括外部和内部div绑定事件。

如何仅为内部div获取精确事件？

这里我附上了jsfiddle演示：

http://jsfiddle.net/mochatony/FkCmH/8/

Answer 1

只需将return false;添加到小方框处理程序。

修正了jsFiddle：http://jsfiddle.net/brodenbaugh/BMPYd/

$('#small-box').click(function(){
    console.log('red box');
    return false;
});

Answer 2

您可以使用.stopPropagation方法阻止事件冒泡到父级，顾名思义。更新了链接：http://jsfiddle.net/EQpA2/

$('#big-box').click(function(){
    console.log('blue box');     
});

$('#small-box').click(function(e){
    e.stopPropagation();
    console.log('red box');     
});