如何找到JQuery隐藏的第一个元素

I want to show first element that is hidden by jquery. my html code is:

我想显示jquery隐藏的第一个元素。我的HTML代码是:

<ol>
    <li>1</li>
    <li style="display:none">2</li>
    <li style="display:none">3</li>
    <li style="display:none">4</li>
    <li style="display:none">5</li>
    <li><a class="add">Add More ...</a></li>
</ol>

I want to show first hidden LI, each time that "a" element was clicked. My solution is below. but I think better way exists.

每次点击“a”元素时,我想显示第一个隐藏的LI。我的解决方案如下。但我认为存在更好的方式。

$("a.add").click(function(){
        var hiddens=$(":hidden",$(this).parent().parent());
        if (hiddens.length>0)
        {
            hiddens.each(function(index,el){
                if(index==0)
                {
                    $(this).slideToggle("fast");
                }
            });
        }

        if (hiddens.length==1)
        {
            $(this).parent().hide();
        }

Tanx

3 个解决方案

#1

Just add a :first selector after you get :hidden set so you get the first element from set found by :hidden selector

只需在获得后添加一个:第一个选择器:隐藏设置,这样就可以从隐藏选择器找到的第一个元素中找到它

$("a.add").click(function(){
    $(":hidden:first").slideToggle("fast");
});

#2

Here is the solution:

这是解决方案:

$("a.add").click(function(){
    $(":hidden:first").show();
});

#3

Thank You "aether": I found below solutions after your answer:

谢谢你“以太”:我在你的回答后找到了以下解决方案:

$(":hidden:eq(0)",$(this).parent().parent())

$(":hidden:lt(1)",$(this).parent().parent())

#1