选择具有最高 z-index 的 DIV答案

【问题标题】：Select DIV with highest z-index选择具有最高 z-index 的 DIV
【发布时间】：2010-01-05 11:30:24
【问题描述】：

示例代码，我可以开始解释这个问题：

<div style="z-index:5">5</div>
<div style="z-index:2">2</div>
<div style="z-index:1">1</div>
<div style="z-index:4">4</div>
<div style="z-index:3">3</div>

（z-index值无所谓，顺序更小。只是示例代码）

问题：我想选择（使用 CSS 或带有 jQuery 的 JS）具有最高 z-index 值的 DIV。在上面的例子中，我想选择第一个，因为它的 z-index 5 高于所有其他的 z-index。

有没有办法做到这一点？额外信息：我正在使用 jQuery + jQuery UI 编写一个简单的窗口管理器，并且 z-indexes 由 .draggable 中的堆栈选项分配。我似乎也找不到一种方法让 jQuery 将最后一个拖动的元素分配给一个类，所以我将采用最高 z-index 方式。请问有什么帮助吗？谢谢。

【问题讨论】：

标签： javascript jquery html jquery-ui z-index

【解决方案1】：

我确定您可以使用停止事件来访问最近拖动的项目，即：

$('.selector').draggable({
   stop: function(event, ui) {
      $(event.target).addClass('justDragged');
   }
});

如果您希望查看绑定到事件的所有函数/变量，您可以使用以下内容：

var str = '';
for (i in event) {
    str += i + ', ';
}
alert(str);

这应该可以很好地指示您在任意数量的 jQuery 回调参数中可用的内容。

【讨论】：

我应该刷新页面 - 显然，这里总会有一个很好的答案！（尽管我使用了 start 而不是 stop，它模拟了“窗口化”行为）接受 :)

【解决方案2】：

在所有 div 上添加类后，您始终可以针对 jQuery(".yourDivs").css("z-index") 进行测试。

【讨论】：

你的意思是我必须遍历所有想要比较 z-index 的元素并存储最高的元素？由于我正在写一个窗口管理器，所以每次执行拖动时调用它可能会有点低效，当有很多 div 时，效率会更低。
是的，这不会很有效，但是您应该考虑使用单独的数据结构来完成您想要实现的目标（一个单独的堆栈来跟踪可能发生的事情）。使用 zindex 我怀疑你会得到更好的方法

【解决方案3】：

在您的位置，我只需在每个 div 上附加事件 onclick。我认为 Javascript 或 jQuery 会自动考虑 zindex 信息，您将在您单击的 DIV 上获得事件。

【讨论】：

【解决方案4】：

我刚刚发现 .draggable 中有一个“开始拖动”事件。我真傻。

$("#window-"+id+".staticwindow.stwin").draggable({ ... 开始：函数（e，u）{ $(".window").removeClass('active'); $(this).addClass('active'); } });

虽然我的这种方法不再与我原来的问题相关，但至少没有循环。我不会接受任何答案，因为这似乎需要一个循环。（虽然我有点倾向于接受 zarko-o 的回答，因为它让我思考事件）

感谢大家的回答！

【讨论】：