jQuery 抑制父元素事件处理程序

Question

我有一个表格，单击行显示并隐藏项目的详细信息，而且我在行内的单元格中还有一个带有自定义onclick处理程序的链接。如何防止行的onclick处理程序在链接onclick处理程序中执行。所以我想通过单击链接打开新窗口，而不显示/隐藏详细信息。

Answer 1

请参阅 stopPropagation（），它用于防止当孩子单击父级也有onclick事件时冒泡事件。查看下面的代码片段以获取简单示例，因为您尚未共享任何代码。

$('.mySpan').on('click', function(e) {
  console.log('span clicked');
  e.stopPropagation();
});
$('.myDiv').on('click', function(e) {
  console.log('div clicked');
});

.myDiv {
  width: 100%;
  height: 50px;
  background: #ccc;
}
.mySpan {
  background: blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="myDiv">
  <span class="mySpan">My span text</span>
</div>