Javascript 是否可以在绝对堆叠的图元上触发单击事件？

我有一个点击事件正在启动。它工作得很好，做了我需要它做的事情。问题出在这里

---

我正在构建的小部件的性质是通过

position:absolute

将元素堆叠在彼此之上。当我单击其中一个堆叠元素时，只有一个事件正在触发，但我希望单击鼠标光标下的每个元素都会触发。有办法做到这一点吗

您可以使用customEvent属性

将所有div放置在父div中

将单击处理程序添加到父div

如果在父框中单击..确定单击是否在任何子框中

如果是真的。然后将单击事件发送到所有子框

片段

//此函数更改所有子div的颜色
函数更改颜色（e）{
this.style.background=“红色”；
}
//此函数附加到父div，父div将向所有div发送单击事件
功能触发器（e）{
//创建一个事件
事件=新自定义事件（“单击”）；
//如果事件源于子div
如果（e.target.className=='box'）
//循环遍历所有子div
对于（变量i=0；i

.box{
填充：10px；
显示：内联块；
边框：纯黑；
}
#母公司{
边框：纯黑；
填充：10px；
}

；
框1
框2
框3
框3

请查看演示或在整个页面中运行代码段，然后单击所有div以查看结果消息

演示：

我在这里做的是：

隐藏顶部元素

及

使用

document.element frompoint

获取下一个绝对元素的坐标，然后重复

堆栈片段：

jQuery（文档）.ready（函数（）{
$common=$（“div.common”）。on（'click.passThrough'，函数（e，ee）{
var$element=$（this.hide（）；
试一试{
如果（！ee）$（“#输出”）.empty（）；
$（“”）.append（'您已单击：'+$element.text（））.appendTo（$（“#输出”）；
ee=ee | |{
pageX:e.pageX，
佩吉：佩吉
};
var next=document.elementFromPoint（ee.pageX，ee.pageY）；
next=（next.nodeType==3）？next.parentNode:next//Opera
$（next）.trigger（'click.passThrough'，ee）；
}捕捉（错误）{
console.log（“click.passThrough失败：“+err.message”）；
}最后{
$element.show（）；
}
});
$common.css（{'backgroundColor'：'rgba（0,0,0,0.2）}）；
});
#输出{
边缘底部：30px；
}
.普通的{
位置：绝对位置；
高度：300px；
宽度：300px；
填充：3倍；
边框：1px#000实心；
}
.elem5{
顶部：150px；
左：150px；
}
埃莱姆先生4{
顶部：180像素；
左：180像素；
}
.elem3{
顶部：210px；
左：210像素；
}
.elem2{
顶部：240px；
左：240px；
}
.elem1{
顶部：270px；
左：270px；
}

最顶端元素
要素2
要素3
要素4
底部元素
单击处理程序是附加到所有堆栈元素还是仅附加到其中一个？它是一个视图类，通过该类呈现的每个按钮都有自己的事件侦听器，当单击时，它开始旋转。现在只有一个元素事件被触发，我希望所有的元素都被触发，我的鼠标落在下面。事件工作时，我只需要在一个元素旋转时不断单击，我希望能够单击，如果它恰好在多个元素上，我想让它触发所有元素。你可以隐藏顶部元素并获得下一个绝对元素与
document.element frompoint
的坐标，然后重复，最后显示它们。请查看演示以了解想法。这看起来很有用。我最后做的就是找到所有驻留在鼠标所在位置的els并手动单击，我会给你检查，谢谢！