避免来自家长的点击

为您提供两个选项：

• 最小变化

• 现代方式

最小变化

在 onXYZ 属性中，您的代码实际上位于具有 event 变量的函数中(直接在大多数浏览器上，在旧 IE 上是全局变量(，因此，如果您将其传递到函数中，则可以对其调用 stopPropagation(如果它具有该函数(或如果它没有(旧 IE(，则使用 cancelBubble：

function do_something() {
  snippet.log("do_something called");
}
function do_something_else(event) {
  snippet.log("do_something_else called");
  if (event.stopPropagation) {
    event.stopPropagation();
  } else {
    event.cancelBubble = true;
  }
}

<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<table>
  <tbody>
    <tr id="x" onclick="do_something()">
      <td>Lorem ipsum</td>
      <td>Lorem ipsum</td>
      <td>Lorem ipsum</td>
      <td>
        <a href="javascript:;" onclick="do_something_else(event)">CANCEL</a>
      </td>
    </tr>
  </tbody>
</table>

现代方式

如今，使用onXYZ属性相当过时。相反，请考虑以现代方式连接您的处理程序，这为您提供了stopPropagation()函数：

var x = document.getElementById("x");
x.addEventListener("click", do_something, false);
x.querySelector("a").addEventListener("click", function(e) {
  e.stopPropagation();
  do_something_else();
}, false);
function do_something() {
  snippet.log("do_something called");
}
function do_something_else() {
  snippet.log("do_something_else called");
}

<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<table>
  <tbody>
    <tr id="x">
      <td>Lorem ipsum</td>
      <td>Lorem ipsum</td>
      <td>Lorem ipsum</td>
      <td>
        <a href="javascript:;">CANCEL</a>
      </td>
    </tr>
  </tbody>
</table>

如果你需要支持IE8，这个答案给你一个函数来处理IE8不支持addEventListener的事实(但确实有其特定于Microsoft的前身attachEvent(。