2

除了我选择的 LI，我想隐藏某个 UL 中的所有其他 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 的课程，所以我认为唯一的选择是 LI。

我真正做的是在 LI 中选择一个 div，因此，我通过以下方式获取所选 LI 的索引：

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

4 回答 4

2

尝试过这样的事情吗？

$(this).closest('ul').find('li').not(this).hide();

或者

$('li', $(this).closest('ul')).not(this).hide();
于 2012-06-20T06:12:54.170 回答
2

您从单击的 div 向上遍历 DOM，然后使用.not($(this).parent()).toggle()-> Not theli隐藏其他元素div

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

.toggle().hide()如果您不希望用户能够撤销他们的决定，则可以替换为。

JS 小提琴：http: //jsfiddle.net/tDmy3/2/

于 2012-06-20T06:23:40.620 回答
0

获取包含所有相关<li>元素的 jQuery 元素集，然后删除所选元素。例如：

$('ul#mylist li').not(selector).hide();

从JQuery 文档：

给定一个表示一组 DOM 元素的 jQuery 对象，.not() 方法从匹配元素的子集构造一个新的 jQuery 对象。提供的选择器针对每个元素进行测试；与选择器不匹配的元素将包含在结果中。

如果你有一个对它的引用，你也可以给元素对象本身而不是选择器。

于 2012-06-20T06:13:03.330 回答
0

这应该有效：

$( 'ul li' ).click( function( e ) {
        // by default, hide all li's
    $( 'ul li' ).hide();
        // show only the selected li
    $( this ).show();
});

http://jsfiddle.net/BqKun/

希望这可以帮助。

于 2012-06-20T06:21:24.410 回答