我有一个愚蠢的(希望很容易解决的)问题，我现在将尝试描述它。
场景-> 我正在尝试使用 HTML/CSS/JS 创建上下文菜单。只是一个具有高 z 顺序的 DIV，出现在用户右键单击的位置。很简单，那部分有效。如果用户单击不支持上下文菜单的某个地方，则不存在的部分是我试图使菜单消失；我试图通过触发 onclick 的 BODY 标记中的一般函数来实现这一目标。由于 BODY 标签的 z 顺序为 -1，而任何其他可能触发上下文菜单出现的标签都被赋予了更高的 z 顺序值，我希望如果我右键单击带有 z- 的元素顺序，比如说，3，那么它会触发 showMenu() 函数；相反，它似乎会执行此操作，并将事件传递给底层的 BODY 标记，这会导致菜单再次隐藏。
正如您想象的那样，这非常令人沮丧。有谁知道如何防止事件被传递下来？ (INPUT 按钮是您可能想要查看的内容，A anchor 是类似的东西，但尚未编码以工作)。
这是 HTML 代码:
这是我的 CSS 文件:
这似乎是 IE、Firefox 和 Chrome 的问题。
最佳答案
许多 DOM 事件从底部对象“冒泡”到容器对象，这意味着它们最终会到达主体。但您可以停止此操作 - 尝试将以下代码添加到您元素的点击处理程序中:
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
...其中 e 是您的函数中已有的表示事件对象的变量。
event.stopPropagation(); 应该可以在现代浏览器中使用，但旧的 IE 方法是 event.cancelBubble = true; - 为了安全起见，您可以同时执行这两种操作(但如上所示，在尝试调用之前检查 .stopPropagation 是否已定义)。
添加上面的代码后，如果您单击元素，您的函数将阻止容器对象(包括主体)看到单击。如果您点击其他地方，您的函数不会被调用，那么正文将处理点击。
在 MDN 上有更多关于此的信息和 QuirksMode.org .
注意:我忽略了 z 顺序问题，因为在这种情况下我认为这不是问题 - 所有元素都是 body 的后代所以(除非你停止它)我希望事件冒泡到 body 无论 z 顺序如何。
关于javascript - 在处理 z 顺序的 HTML 元素时禁用 Javascript 事件失败，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7924931/