Javascript HTML div从后面开始'；无法检测到，但必须位于CSS绝对位置的前面 描述

我有一个带有表的

div

，表中的每个TD都有一个事件

onClick

但有时，我需要在这张桌子前显示一些文本，尽管如此，这些文本不能弄乱我桌子的TDs

所以我的问题是，我需要在表格前面显示一个文本，但是当我点击这个文本时，它不会影响任何东西，文本后面正确点击的TD应该调用它的事件。

我所做的： 我有

#div1

和

#div2

，

#div1

在后面，

#div2

在前面（两者都是

位置：绝对的

）。
所以，

#div1

在那里，但它是不可见的，只显示了

#div2

尽管只显示

#div2

，但我需要在

#div2

前面显示

#div1

中的文本。 为了做到这一点，我在

#div1

上放置了一个

span

，并设置span的

z-index:1

。 这样，

#div1

仍然没有出现，但是它的

span

是

一切都很好，但我现在有一个新问题

我需要单击

#div2

（前面），并获取整个div的事件

即使有来自

#div1

的文本，它也不应该在那里有业务，只是显示出来

仅仅阅读是很难理解的，所以我做了这个

点击红色“Text1 from#div1…”，我需要它来提醒TD html内容

由于

#div1

和

#div2

是DOM同级，因此无法在

#div2

中“捕获”

#div1

的事件。由于

SPAN

是

#div1

的后代，但您仍然需要与附加到

#div2

的处理程序相同的处理程序，因此需要在多个元素上附加侦听器或重新排列DOM

解决此问题的一种方法是将单击委托给父div：

$("#container").on('click', '#div2, #div1 span', function(){
    alert("#div2");
})

---

演示：

您可以尝试以下解决方法：

JavaScript

$(document).ready(function(){
    $("#div2").click(function(){
        clickedOnDiv2();
    });
    $('#span1').click(function (e) {
        var div2 = $('#div2'),
            offset = div2.offset();
        if (e.pageX > offset.left && e.pageX < offset.left + div2.width() &&
            e.pageY > offset.top && e.pageY < offset.top + div2.height()) {
                clickedOnDiv2();
            }
    });

    function clickedOnDiv2() {
        alert('#div2');
    }
})​

$（文档）.ready（函数（）{
$（“#div2”）。单击（函数（）{
单击ndiv2（）；
});
$（'#span1'）。单击（函数（e）{
var div2=$（“#div2”），
offset=div2.offset（）；
如果（e.pageX>offset.left&&e.pageXoffset.top&&e.pageY

在此解决方案中，span元素上有一个click事件侦听器。如果用户点击Text1，点击结束#div2，我们将执行

clickOnDiv2

在这里，它回答了你评论中的问题。 它是跨浏览器的。

您可以通过一些CSS点击

#div1 span1

：

#div1 span{
  pointer-events: none;
}

它应该可以在FF和webkit浏览器中使用，但如果使用IE8或更低版本，就太倒霉了

---

工作示例：

@DavidThomas我只需要提醒div2，即使我点击“Text1”，它也应该提醒“#div2”@DavidThomas我编辑过，请阅读。谢谢不能在单击事件中“忽略”元素。如果在文本上单击，您需要能够在冒泡阶段跟踪TD（使跨度成为子代）、委派事件或附加多个侦听器。@David请参见：抱歉，链接错误，现在它是正确的。确定，但是这是对我的评论的回答吗？这不会处理带有Text1的span不超过#div2的情况。@MinkoGechev你的意思是“结束”，就像z-indexed over一样？它的浏览器兼容性不好。对于IE和Opera，它只适用于SVG。@MinkoGechev确实，这是一个缺点。是的，它会，但您必须使用上的

添加事件侦听器。