jQuery Target Определенное количество элементов из N
С помощью 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>
2 ответа
Решение
$(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', '#');
}
});
Как насчет чего-то вроде...
var count = 0;
$('li.hidden').each(function(){
$(this).removeClass('hidden');
count++;
if(count >= 5)
return false; //this breaks out of the .each()
});