Клавиши со стрелками не работают в Firefox

Question

Мы создаем слайд-шоу в HTML / CSS / JS, но по какой-то причине оно не работает в Firefox.Он работает в браузерах Webkit без проблем ..

Код такой:

    keyPress : function() {
      $( document.body ).keydown(function(e) {
         if ( e.keyCode === 37 || e.keyCode === 39 || e.which == 37 || e.which === 39) {
            e.preventDefault();
            ( e.keyCode === 39 || e.which === 39 ) ? Slides.next() : Slides.prev();
         }
      });
   },

Если я использую только $( document ) вместо ( document.body ), это меняет мои цвета, нослайды не меняются ..

По какой-то причине Firefox (7.0.1, OSX Lion) не воспринимает нажатия клавиш .. Он работает в Safari / Chrome без проблем.

Сайт, на котором мы тестируем это: # взял ссылку

Answer 1

ОБНОВЛЕНИЕ: Я думаю, что ваша проблема заключается в использовании селектора "document.body". Это работает для меня в Chrome, но не в Firefox (http://jsfiddle.net/Jncrh/2/). Попробуйте вместо этого просто выбрать «документ» и посмотреть, будет ли он работать. (http://jsfiddle.net/Jncrh/5/)

$(document).bind('keydown',function(e){
    if (e.which==37 || e.which==39) {
        e.preventDefault();
        if (e.which==37) {
            alert("going back");
        } else {
            alert("going forward");
        }
    }
}); 

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

ПРЕДЫДУЩАЯ: Быстрый поиск в Google показывает, что Firefox использует event.charCode вместо event.keyCode. Попробуйте это:

key = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;
if (key===37 || key===39) {...

Тем не менее, jQuery должен быть в состоянии собрать всех с его собственным событием. Которое , поэтому я не понимаю, почему это не работает как есть для вы.

Answer 2

В событиях keydown и keyup все основные браузеры поддерживают свойство keyCode соответствующего события, поэтому нет необходимости в свойстве which.Кроме того, чтобы отлавливать ключевые события во всем документе, вам необходимо прикрепить слушатель к документу, а не к телу.

Вот полная страница о ключевых событиях JavaScript:вот пересмотренная версия вашего кода:

$(document).keydown(function(e) {
    var leftArrow = (e.keyCode == 37), rightArrow = (e.keyCode == 39);
    if (leftArrow || rightArrow) {
        e.preventDefault();
        rightArrow ? Slides.next() : Slides.prev();
    }
});

Answer 3

    if ($.browser.mozilla) {     
        $(document).keypress (keyType); 
    } 
    else{
       $(document).keydown (keyType);
    }

    function keyType(e){
    if (e.keyCode==37 || e.keyCode==39) { 
        e.preventDefault();         
        if (e.which==37) {             
           //handle left
        } 
        else { 
          //handle right      
        }       
    } 
}