是的，你可以这样做。

使用指针事件：none以及IE11的CSS条件语句（在IE10或更低版本中不起作用），您可以获得一个跨浏览器兼容的解决方案。

使用AlphaImageLoader，您甚至可以在覆盖div中放置透明的.PNG/.GIF，并让单击流到下面的元素。

CSS:

pointer-events: none;
background: url('your_transparent.png');

IE11条件：

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='your_transparent.png', sizingMethod='scale');
background: none !important;

这里是一个包含所有代码的基本示例页面。

更简单的方法是使用数据URI内联透明背景图像，如下所示：

.click-through {
    pointer-events: none;
    background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);
}

我需要这样做，并决定走这条路：

$('.overlay').click(function(e){
    var left = $(window).scrollLeft();
    var top = $(window).scrollTop();

    //hide the overlay for now so the document can find the underlying elements
    $(this).css('display','none');
    //use the current scroll position to deduct from the click position
    $(document.elementFromPoint(e.pageX-left, e.pageY-top)).click();
    //show the overlay again
    $(this).css('display','block');
});

我认为您可以考虑更改标记。如果我没有错，您希望在文档上方放置一个不可见的层，并且您的不可见标记可能位于文档图像之前（这是正确的吗？）。

相反，我建议您将不可见图像放在文档图像之后，但将位置更改为绝对位置。

请注意，您需要一个父元素来具有position:relative，然后您就可以使用这个想法了。否则，绝对层将仅放置在左上角。

绝对位置元素相对于第一个父元素定位具有非静态位置的元素。如果没有找到这样的元素，则包含块为html

希望这有帮助。有关CSS定位的更多信息，请参阅此处。

另一个尝试（情境）的想法是：

将所需内容放入div中；将非点击覆盖放在整个页面上，z索引更高，制作原始div的另一个裁剪副本overlay和abs将复制div放置在与原始内容相同的位置，您希望使用更高的z索引进行单击？

有什么想法吗？

我加上这个答案是因为我没有看到它的全部内容。我能够使用elementFromPoint完成这一操作。所以基本上：

将单击附加到要单击的div把它藏起来确定指针所在的元素单击元素。

var range-selector= $("")
    .css("position", "absolute").addClass("range-selector")
    .appendTo("")
    .click(function(e) {
        _range-selector.hide();

        $(document.elementFromPoint(e.clientX,e.clientY)).trigger("click");
    });

在我的例子中，重叠的div是绝对定位的——我不确定这是否会产生差异。这至少适用于IE8/9、Safari Chrome和Firefox。