0

好的，我找不到这个的答案....并希望得到帮助....

我想隐藏一个元素的 50%，或者如果元素超出 X 个子级，则隐藏。

<ul>
  <li>
    <div></div>
    <div></div>
    <div></div>
   </li>
<ul>

如果此列表中有超过 3 个 div - 隐藏它们。

4

3 回答 3

1

您可以通过编程方式获取孩子并决定在您的代码中对哪些孩子进行操作：

function hideChildrenAbove(n) {
    var items = $("#list li").children();
    for (i = n; i < items.length; i++) {
        items.eq(i).hide();
    }
}


hideChildrenAbove(3);​

工作示例：http: //jsfiddle.net/jfriend00/SmVfA/

:gt(n)或者您可以使用并让选择器完成工作来动态构建选择器字符串：

function hideChildrenAbove(n) {
    $("#list li div:gt(" + (n - 1) + ")").hide();
}

hideChildrenAbove(3);​

工作示例：http: //jsfiddle.net/jfriend00/pAdqn/

这是一个示例，其中单击孩子会导致任何超过 3 岁的孩子切换：

function toggleChildrenAbove(parent, n) {
    var items = $(parent).children();
    for (i = n; i < items.length; i++) {
        items.eq(i).toggle();
    }
}


$("#list li").click(function() {
    toggleChildrenAbove(this, 3);
});

工作示例：http: //jsfiddle.net/jfriend00/9nQPL/

于 2012-10-19T15:00:24.113 回答
0

CSS：

ul li div{
   display:none;
}

JavaScript：

$('ul li div:lt(3)').show();

这使用“小于”的 JQuery 选择器。这样做可能有一种更简洁的方法，但是如果您知道您只想显示第一个 3 个 div，那么这应该可以工作。

http://api.jquery.com/lt-selector/

于 2012-10-19T14:58:00.587 回答
0

首先，您需要计算元素。在这种情况下会。

var elementCount = $("li").children("div").length;

然后你躲起来

$("li").children("div").css("display", "none");

如果您可以在标签中添加一个ID，那就太好了

于 2012-10-19T14:58:48.873 回答