javascript - 隐藏除选定的之外的所有 LI

Question

我想隐藏某个 UL 中除我选择的 LI 之外的所有其他 LI。

<ul>
  <li><div></div></li>
  <li><div></div></li>
</ul>
<ul>
  <li><div></div></li>     -- HIDE
  <li><div></div></li>     -- SELECT
  <li><div></div></li>     -- HIDE
</ul>
<ul>
  <li><div></div></li>
  <li><div></div></li>
</ul>

我怎样才能最好地解决这个问题？

我尝试过使用索引，但在使其正常工作以及选择正确的 UL 时遇到一些问题。正如您所看到的，我没有 UL 或 LI 的类(class)，所以我认为唯一的选择是 LI。

我真正做的是在 LI 中选择一个 div，这样我就可以通过以下方式获取所选 LI 的索引:

var li_index = $(this).parent().index();

Answer 1

从被单击的 div 向上遍历 DOM，然后使用 .not($(this).parent()).toggle() 隐藏其他元素 -> 不是 li 包围此 div

$('div').click(function () {
    $(this).closest('ul').find('li').not($(this).parent()).toggle();
});

如果您不希望用户能够撤销其决定，则可以将

.toggle() 替换为 .hide()。

JS fiddle :http://jsfiddle.net/tDmy3/2/