Javascript 在div上触发单击事件，但通过悬停

我有一个div绝对位于其他绝对定位div之上，我希望下面的div同时具有mouseover、mouseout和click事件，并且顶部div也具有click事件

我能够在下面的div上获取鼠标事件的唯一方法是添加指针事件：无到上面的div，但是当css属性存在时，上面的div不会获取单击事件

这是一个代码笔，显示了这个问题

---

@Wryte啊！好的，你想要完成的事情有问题。阴影不是一个容器，而是覆盖整个外分区的一层，覆盖其余内分区。由于shade div不在事件冒泡的链中，因此不会调用它，或者如果在shade div上捕获事件，则不会在内部div上触发事件。

---

你能做的，就是变暗外部的DIV，增加内部DIV的透明度。顺便问一下，为什么您需要在阴影分区上跟踪事件？

如何同时单击顶部分区和底部分区？你所要求的东西在99%的时间里都意味着你的整个概念是有缺陷的，需要重新思考。好吧，它们是相互重叠的，所以点击一个就会同时点击两个。真正的问题是，悬停事件不会通过顶部事件。另外，上面的是半透明的，所以让下面的触发悬停事件是可取的。从我在代码中看到的情况来看，您并没有阻止事件传播，因此您应该能够捕获这两个事件上的点击事件。您可以通过添加到底层的div鼠标事件侦听器并对其执行一些操作来验证这一点。@CharlieAffumigato我可以在这两个对象上获得click事件，但不能在这两个对象上获得hover事件both@Wryte你说的悬停是指滑鼠和滑鼠？如果下面的层是其他较小div的主层/容器，则第一次进入主区域时会出现mouseenter事件，离开该区域时会出现鼠标。在声明outer之后尝试此操作：

outer.on（'mouseenter'，function（）{console.log（'mouse entered the outer area'）；}）；on（'mouseleave'，function（）{console.log（'mouse left the outer area'）；}）并检查控制台。如果这是模式弹出窗口的阴影，我希望单击关闭模式并隐藏阴影，但在单击阴影之前，阴影下的元素也会触发悬停事件非常有趣。我建议您处理上面的点击事件的阴影（您正在解释的方式），然后让鼠标事件逗乐后面的div；）。您可以创建一个函数hideShowShade并随时调用它。