nextAll () - обход нескольких списков - PullRequest
0 голосов
/ 10 февраля 2012

У меня есть три списка. Когда я нажимаю «Далее», я хочу получить следующий «li», и это нормально, но когда я достигну конца первого списка, я бы хотел, чтобы следующий был первым из второго списка… Я постараюсь объяснить немного лучше.

<ul class='list'>
   <li image_id="1"></li>
   <li image_id="2"></li>
</ul>

<ul class='list'>
   <li image_id="3"></li>
   <li image_id="4"></li>
</ul>

<ul class='list'>
   <li image_id="5"></li>
   <li image_id="6"></li>
</ul>

Итак, у меня есть три списка ... затем я хочу узнать, сколько у меня li, поэтому я написал ..

var how_many $('ul.list li').length;

это хорошо, это возвращает все 6 ли ..

далее Я хочу найти li, если у него есть идентификатор изображения, в котором я сейчас нахожусь.

var which = $('ul.list li[image_id^="' +  image_id +'"]');

на данный момент все работает нормально.

так что теперь я собираюсь выяснить, каков идентификатор изображения следующего ли ..

var found_next = which.nextAll('ul.list li').attr('image_id');

это тоже работает ..

Затем я загружаю новое изображение, используя .load с обратным вызовом, который обновляет текущий image_id ...

«ПРОБЛЕМА» - это когда click, next..next..next и т. Д., И я дошел до того, что первый список jquery возвращает «undefined», а не первый li из второго списка. У кого-нибудь есть предложения?

Любая помощь будет принята с благодарностью.

Ответы [ 2 ]

4 голосов
/ 10 февраля 2012

.nextAll работает только для братьев и сестер.Если вы хотите перейти к следующему <li>, вам нужно выбрать все элементы и использовать .index и .eq(), чтобы выбрать следующий <li>.

var $li = $('ul.list li');
// Example, inside an event listener:
    var index = $(this).index($li);
    var nextElement = $li.eq( index + 1 );
1 голос
/ 10 февраля 2012

Не уверен, что вы уже поняли это. Если нет, вы можете попробовать:

var $li = $('ul.list li'), i = 0, $currentLi;

$('button').click(function(){
    if(i < $li.length) {
        $currentLi = $li.eq(i); //eq(i) returns a jQuery object where i is the zero-based index
        i++
    }else {
        alert('End of LIs');
    }
});

Вот рабочая Демо

...