Блог

У меня есть такой список:

 <div class="list"></div>
<div class="list"></div>
<div class="list on"></div>
<div class="list"></div>
... etc
  

Я получаю общее количество следующим образом:

 var count = $('.list').length; // 4 in this case
  

Но я хочу написать функцию, которая выбирает следующий div со стрелкой вниз, и я не могу понять, как получить следующий div, выбрать его и отменить выбор текущего div. Это то, что у меня есть сейчас, но это не работает:

 var visible = $('.list:visible');
var on = $('.list.on:visible');
if (e.keyCode == 40) { // down key
    if(on.length == 0) {
        visible.first().addClass("on"); // this works
    }
    else if( // div placement // < count) {
        var next = on.next(); // this part doesn't work
        on.removeClass("on"); // :(
        next.addClass("on"); // :(
    }
    else { // if its the last div
        // do nothing
    }
}
  

Вы можете сделать:

 if (e.keyCode == 40) { // down key
    if(on.length == 0) {
        visible.first().addClass("on");
    }
    else if(on.length amp;amp; on.next("div.list").length > 0) {
        var next = on.next("div.list");
        on.removeClass("on");
        next.addClass("on");
    }
    else { // if its the last div
    // do nothing
    }
}
  

Быстрая демонстрация: http://jsfiddle.net/GL7tA /

Вы можете работать, .index() чтобы увидеть, какой элемент в данный момент «выбран»:

 var $items = $('.list:visible'),
$selectedItem = $items.filter('.on'),
selectedIndex = $items.index($selectedItem);

if (selectedIndex == -1) {
  $items.eq(0).addClass('on');
} else if (selectedIndex   1 < $items.length) {
  $selectedItem.next().andSelf().toggleClass('on');
}
  

У вас the else if ( частично синтаксическая ошибка, когда вы говорите, что это не работает.

Это не работает, потому else if что ожидается вычисление условия, но вы даже не закрываете скобки этого if условия, и при этом вы не открыли скобки для его блока.