JQuery Custom Dropbox: как Tabindex - PullRequest
       6

JQuery Custom Dropbox: как Tabindex

2 голосов
/ 14 декабря 2011

Я использую jQuery для настройки своего собственного Dropbox, но мне было интересно, как я могу применить к нему tabindex.

Я пытаюсь использовать скрытое событие выбора фокуса / размытия, но, похоже, оно не работает.

Я также пытаюсь применить атрибут tabindex к моей настраиваемой ячейке (div), но безуспешно.

Может кто-нибудь иметь образец или ссылку, чтобы показать мне, как я могу этого достичь?

Спасибо

Ответы [ 2 ]

0 голосов
/ 14 декабря 2011

Я не уверен, что полностью понимаю, к чему вы клоните, но, возможно, это поможет вам начать: http://jsfiddle.net/2rCFV/1/

$(window).keydown(function(e){
    if(e.which === 9){ //tab
        var selected = $('.selected');
        selected.removeClass('selected');

        var tabIndex = +selected.attr('tabIndex') + 1; //plus sign at beginnign converts it to a number

        var next = selected.siblings('[tabIndex=' + tabIndex + ']');

        if(next.length > 0){ //if this element exists
            next.addClass('selected');
        }else{
            selected.siblings('[tabIndex=' + 1 + ']').addClass('selected'); //select the first one
        }

        e.preventDefault();
    }
});
0 голосов
/ 14 декабря 2011

Я представляю, что у вас может быть переменная - текущий выбранный элемент.Вы просто перехватываете события клавиатуры пользователя и изменяете текущий выбранный элемент, добавляя / удаляя классы в соответствующий div.Когда нажата кнопка ввода, вызовите нужное событие на основе текущего выбранного элемента.

какой-то псевдокод:

var current = 0;

if(key = down){
    current++;
    currentElem.removeClass('active');
    currentElemen = currentElem.next();
    currentElem.addClass('active');
}

if(key = up){
    current--;
    currentElem.removeClass('active');
    currentElemen = currentElem.previous();
    currentElem.addClass('active');
}

if(key = enter){
    doStuff(current);
}

Надеюсь, это даст вам представление!

...