替换

event.preventDefault();
return false;

与

event.stopPropagation();

事件.停止传播（）

停止将事件冒泡到父元素，从而防止向任何父处理程序通知该事件。

事件.预防默认值（）

阻止浏览器执行默认操作。使用isDefaultPrevented方法了解是否调用过此方法（在该事件对象上）。

使用stopPropagation方法：

event.stopPropagation();

不要忘记IE：

if (event.stopPropagation) {    // standard
        event.stopPropagation();
    } else {    // IE6-8
        event.cancelBubble = true;
}

正如其他人提到的，试试stopPropagation()。
还有第二个处理程序可以尝试：event.cancelBubble = true;这是一个IE特定的处理程序，但至少在FF中支持它。我对它了解不多，因为我自己没有使用过它，但如果其他方法都失败了，它可能值得一试。

使用jQuery时，您不需要单独调用stop函数。
您可以在事件处理程序中只返回false
这将停止事件并取消冒泡。
另请参见event.preventDefault() vs. return false
从jQuery文档中：
因此，这些处理程序可以通过调用event.stopPropagation()或返回false来阻止委托处理程序触发。

这是一个很好的例子来理解事件冒泡的概念。基于以上的答案，最终的代码将看起来像下面提到的。当用户点击复选框时，事件传播到其父元素'header'将使用event.stopPropagation();停止。

$(document).ready(function() {
            $('#container').addClass('hidden');
            $('#header').click(function() {
                if($('#container').hasClass('hidden')) {
                    $('#container').removeClass('hidden');
                } else {
                    $('#container').addClass('hidden');
                }
            });
          $('#header input[type=checkbox]').click(function(event) {
              if (event.stopPropagation) {    // standard
                   event.stopPropagation();
               } else {    // IE6-8
                    event.cancelBubble = true;
               }
          });     
  });

感谢@mehras的代码。我只是创建了一个片段来演示它，因为我认为这会受到赞赏，我想找个借口尝试这个功能。

$(document).ready(function() {
  $('#container').addClass('hidden');
  $('#header').click(function() {
    if ($('#container').hasClass('hidden')) {
      $('#container').removeClass('hidden');
    } else {
      $('#container').addClass('hidden');
    }
  });
  $('#header input[type=checkbox]').click(function(event) {
    if (event.stopPropagation) { // standard
      event.stopPropagation();
    } else { // IE6-8
      event.cancelBubble = true;
    }
  });
});

div {
  text-align: center;
  padding: 2em;
  font-size: 1.2em
}

.hidden {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="header"><input type="checkbox" />Checkbox won't bubble the event, but this text will.</div>
<div id="container">click() bubbled up!</div>

下面是一个对我有效的技巧：

handleClick = e => {
    if (e.target === e.currentTarget) {
        // do something
    } else {
        // do something else
    }
}

说明：我将handleClick附加到一个模态窗口的背景中，但它也会在模态窗口内的每次单击时触发（因为它位于背景div中），因此我添加了条件(e.target === e.currentTarget)，它只在单击背景时才满足。

在angularjs中，这应该是可行的：

event.preventDefault(); 
event.stopPropagation();