javascript - stopPropagation 与 stopImmediatePropagation

Question

event.stopPropagation()和event.stopImmediatePropagation()有什么区别？

Answer 1

stopPropagation 将阻止任何 父 处理程序被执行 stopImmediatePropagation 将阻止任何父处理程序 以及 任何 < strong>其他处理程序执行

来自 jquery documentation: 的快速示例

$("p").click(function(event) {
  event.stopImmediatePropagation();
});

$("p").click(function(event) {
  // This function won't be executed
  $(this).css("background-color", "#f00");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p>example</p>

注意这里事件绑定(bind)的顺序很重要!

$("p").click(function(event) {
  // This function will now trigger
  $(this).css("background-color", "#f00");
});

$("p").click(function(event) {
  event.stopImmediatePropagation();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p>example</p>