javascript - jquery获取最近的隐藏div

Question

选择任何复选框时，我试图选择 id = B 的 div

<div id="a"><div style="display:none;" id="B"></div></div>
<ul>
<li><input type='checkbox'></li>
<li><input type='checkbox'></li>
<li><input type='checkbox'></li>
</ul>

以下返回未定义；

$(this).closest("div:hidden").attr("id")

有什么帮助吗？

Answer 1

这是因为.closest沿着 dom 树向上移动你想要的；是获取 ul 元素，然后获取div:hidden 兄弟元素：

$(this).closest("ul").siblings("div:hidden").attr("id");

这是基于thisul 元素指代子、孙子、曾孙、N-child 的。

---

正如 TJ Crowder 指出的那样，这仅在 div 是 ul 的兄弟而不是兄弟的子节点时才有效：此代码段查找兄弟的子节点：

$(this).closest("ul").siblings().find("div:hidden").attr("id");

Answer 2

你可以使用

$('ul').change(function(){
   $('#B').show();
});

我更喜欢在 UL 标签上放一个 id 并引用该 ID

<div id="a">
    <div style="display:none;" id="B"></div>
</div>
<ul id="theUl">
    <li><input type='checkbox' /></li>
    <li><input type='checkbox' /></li>
    <li><input type='checkbox' /></li>
</ul>


 $('#theUl').change(function(){
       $('#B').show();
});

Answer 3

您需要做的是上到ul，回到上一个div，然后下到它隐藏的孩子。所以：

var id = $(this).closest('ul').prev().children('div:hidden').attr(id);