2

jQueryを使用して、要素のコレクションから特定の数の要素を選択しようとしています。定義する要素の数を選択して変更するだけです。したがって、以下のコードには、非表示のクラスを持つliがたくさんあります。最初の5つの要素から非表示のクラスのみを削除したいと思います。以下に私のコードを投稿します、それは理にかなっているはずです。今のところ、ループを使って最初の5つを通過しています。改善の余地があるかどうか教えてください。ありがとう！

('a.moreLink').live('click', function() {
    var $ul = $(this).parent().prev();
    var $li = $ul.children('li.hidden').first();
    for(i=0;i<5;i++) {
        $li.removeClass('hidden');
        $li = $li.next('li');
    }
    if($ul.children("li.hidden").size() == 0) {
        $(this).text('Go to the full site to see more').attr('href', '#');
    }
});

<ul id="EventsList">
    <li></li>
    ....(4 more non hidden)
    <li class='hidden></li>
    ....(N more hidden)
</ul>
<div>
    <a href='#' id='MoreEvents' class='moreLink'>More Events</a>
</div>
4

2 に答える 2

1

のようなものはどうですか...

var count = 0;
$('li.hidden').each(function(){
    $(this).removeClass('hidden');
    count++;
    if(count >= 5)
        return false; //this breaks out of the .each()
});
于 2012-09-14T14:10:06.520 に答える
1 
$(document).on('click', 'a.moreLink', function() {
    var $ul = $(this).parent().prev();
        $ul.children('li.hidden').slice(0,5).removeClass('hidden');

    if ($ul.children("li.hidden").length) {
        $(this).text('Go to the full site to see more').attr('href', '#');
    }
});
于 2012-09-14T14:32:33.350 に答える