jquery - 点击时根据z-index值选择div

Question

我很困惑如何获得我想要的 div id。如果我要单击 div layer3，则所有 DIV（父 div）也包含在其中。

HTML：

<div id="parentdiv">
    <div style="z-index:0 ; border:1px solid; width:200px; height:200px;" id="layer1">
        <div style="z-index:1 ; border:1px solid; width:150px; height:150px;" id="layer2">
            <div style="z-index:2 ; border:1px solid; width:100px; height:100px;" id="layer3">
                INNER DIV content
            </div>
        </div>
    </div>
</div>

太感谢了

Answer 1

当我将单击绑定到具有内部列表的列表时，我也遇到了同样的问题。所以我为你的例子改变了我的代码。

$('#parentdiv').on('click', 'div', function (e)
{
    // Stops the inner div elements to also call their parent div
    e.stopPropagation();
});

这将使您能够单击#parentdiv 的所有子项。e.stopPropagation() 是一种原生 Javascript 方法，可防止您的点击在 DOM 树中上升。

Answer 2

$('#layer3').click(function() {
    alert($(this).text()); //should be alert INNER DIV content
});

Answer 3

您应该分享您的代码，以便我们准确了解您想要什么，但也许您只需要为 div 设置一个处理程序：

$('#layer3').click(function() {
    // your code
});