是否有办法判断事件是否在前一个冒泡阶段已处理？

Question

在JS中，有没有办法判断事件在到达currentTarget之前是否已经在先前的冒泡阶段处理过？

我对此行为的用例如下：

我正在制作一个网站，这些网站的结构是一堆彼此堆叠的div。它们均为100vh的最小值。有点像这样：

div {
  width: 100vw;
  height: 100vh;
}
div:first-child {
  background-color: yellow;
}
div:nth-child(2) {
  background-color: purple;
}
div:nth-child(3) {
  background-color: green;
}

<div></div>
<div></div>
<div></div>

在我的应用程序中，有一个菜单会自动滚动到与菜单项相对应的div。这一切都很好。

问题出现在用户只是手动滚动浏览页面而不是使用菜单时。发生这种情况时，很难使用鼠标滚轮使该部分与页面的顶部和底部完美对齐。以该代码段为例，进入全屏显示状态，您可能会注意到仅使用鼠标滚轮就不可能完美地排列紫色div。 （我猜取决于您的鼠标）

我想拥有它，以便如果用户在部分之一中单击，页面将自动滚动，以使该部分与页面的边界完全对齐。

这里的警告是，如果事件是在先前的冒泡阶段中由其他处理程序处理的，则我只想这样做。例如，如果用户单击该部分内的按钮，则用于自动聚焦的处理程序需要能够检测到这一点并决定不执行该操作。 我不希望诉诸于较早出现的处理程序中设置一些变量。我也不想阻止事件一起冒泡，仅仅是因为在一个节中可能发生许多类型的事件，并且我宁愿不要在整个事件处理程序中重复执行代码/调用相同的函数，只是这样一个可以正常工作。

在JS中，有没有办法判断事件在到达currentTarget之前是否已经在前一个冒泡阶段进行过处理？我对此行为的用例如下：我正在建立一个网站，......>

Answer 1

默认情况下，除非您在嵌套元素的处理程序中显式stopPropagation，否则您的click事件可能会冒泡到父元素。

如果使用的是jQuery之类的库，则只需几行代码就可以停止在多个元素上的传播。