Перебор списка используя контролл?

Question

[Артур Кох]

Добрый вечер. Перепробовал разные варианты, но все не то выходит. Подскажите как решить задачу.

Есть список неограниченной глубины. jsfiddle.net/DmhQj/1/



Каждый элемент LI имеет уникальный ID. Некоторые случайные элементы А вложенные в LI имеют класс .jstree-search и выделены жирным.



По дефолту на первый элемент .jstree-search вешается класс .jstree-glow, который выделяет этот элемент.



Кнопки prev и next должны вешать .jstree-glow на предыдущий/следующий в списке элемент .jstree-search, при этом снимая .jstree-glow с текущего. Дойдя до последнего элемента кнопка next должна стать заблокированной. Ну а если выделен первый элемент, то заблокированной становится prev.

Answer 1

[Skpd]

Возможно подойдут селекторы :last и :first.

Comments

[Артур Кох]

Я знаком с этими селекторами.

[Skpd]

В таком случае вы забыли написать в конце вопроса «Напишите за меня, пожалуйста.»

[Артур Кох]

Забыл.

Answer 2

[tsmar]

посмотрите в сторону .next() и .prev() — там все достаточно просто

Comments

[Артур Кох]

они не решают задачу.

[tsmar]

тогда в лоб

Answer 3

[bullgare]

(function ($)
{
    var classSelected = 'jstree-glow',
        $allEls = $('.jstree-search'),
        $prevBtn = $("#prev"),
        $nextBtn = $("#next");
    
    function moveDown()
    {
        var $el = $('.' + classSelected),
            pos = $allEls.index($el);
        
        if (pos < $allEls.length - 1) {
            move($el, $allEls.eq(pos + 1), pos + 1);
        }
    }
    
    function moveUp()
    {
        var $el = $('.' + classSelected),
            pos = $allEls.index($el);
        
        if (pos > 0) {
            move($el, $allEls.eq(pos - 1), pos - 1);
        }
    }
    
    function move($from, $to, newPos)
    {
        $from.toggleClass(classSelected, false);
        $to.toggleClass(classSelected, true);
        
        $prevBtn.attr('disabled', newPos == 0);
        $nextBtn.attr('disabled', newPos == $allEls.length - 1);
    }  

    $(document).ready(function () {
        $prevBtn.on('click', function () {moveUp();});
        $nextBtn.on('click', function () {moveDown();});
    });    
}(jQuery));​

jsfiddle.net/bullgare/f2QTH/