查找唯一<div>包含动态的可见并<ul>返回 <ul> id

Question

我有一堆动态选项卡(div(，例如：

<div id="collection">
  <div id="tab-1">
    <ul id="sortable-tab-1">
      <li>
      </li>
    </ul>
  </div>
  <div id="tab-2" class="hidden">
    <ul id="sortable-tab-2">
      <li>
      </li>
    </ul>
  </div>
  .... etc ...
</div>

我正在寻找使用jquery查找哪个选项卡(div(可见的最佳方法。由于选项卡是动态的，我不知道id，但我知道哪些div是隐藏的，因此只留下一个可见的div。

我需要以某种方式找到可见div的ul-id，然后返回ul-id。因此，我的结果是"sortable-tab-1"。

基本上，我需要知道选择了哪个选项卡，这样我才能发布正确的可排序列表。

JavaScript让我头疼！

有人能帮忙吗。非常感谢。

Answer 1

$('#collection > div:visible > ul').attr('id')

Answer 2

理论：我假设所有隐藏的选项卡都有"tab something"作为id属性值，并在类名中有"hidden"。因此，如果你找到一个没有class="hidden"的潜在div，那么你可以从中找到任何东西。

代码：

  $("div#collection > div[id^=tab-").each(function(index)
  {
    if($(this).hasClass("hidden")==false)
        return $(this).children("ul").attr("id");
  }

注意：如果有多个div带有"隐藏"类，则只返回最后一个div的标记id。。。