Jquery - отключить прокрутку окна с помощью клавиш со стрелками в фокусе списка - PullRequest
Новая
       48

Jquery - отключить прокрутку окна с помощью клавиш со стрелками в фокусе списка

3 голосов
/ 20 февраля 2012

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

Я пытался: 

$('.selectionList').focus(function(event){
    $(document).keydown(function(e) {
    return false;
    });
});

$('.selectionList').blur(function(event){
    $(document).keydown(function(e) {
    return true;
    });
});

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

Событие $ ('. SelectionList'). Keyup () выглядит следующим образом: 

$('.selectionList').keyup(function(event){
    if (event.keyCode == 13)      //enter
    {
        $('.listNameBox a').click();
    }
    else
    {
    if ((event.keyCode == 38) && ($(this).children('li:eq(' + ($('.selectionList li.selected').index() - 1) + ')').length > 0)) //up
        {
            selectListItem($(this).children('li:eq(' + ($('.selectionList li.selected').index() - 1) + ')'));
        }
    else if ((event.keyCode == 40) && ($(this).children('li:eq(' + ($('.selectionList li.selected').index() + 1) + ')').length > 0)) //down
        {
            selectListItem($(this).children('li:eq(' + ($('.selectionList li.selected').index() + 1) + ')'));
        };
    }
});

Любая помощь будет оценена.

Ответы [ 2 ]

1 голос
/ 20 февраля 2012

использовать jQuery .on() и .off() вставленных событий привязки, подобных этому. Это решило бы вашу проблему. 

function prevent(event){
 event.preventDefault();
 return false;
}


$('.selectionList').on('focus', function(){
  $(this).on('keydown', prevent);
 });
$('.selectionList').on('blur', function(e){
 $(this).off('keydown', prevent);
};
0 голосов
/ 20 февраля 2012

Ваш обработчик .blur() не заменяет предыдущий обработчик нажатия клавиш, он добавляет еще один. (И последующие события фокусировки и размытия продолжают добавлять все больше и больше.)

Попробуйте вместо этого использовать $(document).off('keydown') или $(document).unbind('keydown') в обработчике .blur(), чтобы удалить предыдущий обработчик нажатия клавиш.

Метод .off() является новым в jQuery 1.7 и сочетается с .on(), но для более старых версий вы можете использовать метод .unbind() . Если вы посмотрите на документ, с которым я связан, то увидите, что jQuery дает вам возможность точно контролировать, какие обработчики не связаны, но в вашем случае простой синтаксис с именем события должен подойти.

...