Как я могу отслеживать клавиши со стрелками в Chrome и IE?

Question

Я использую следующий код для отслеживания ключевых событий

oEvent=window.event || oEvent;
    iKeyCode=oEvent.keyCode || oEvent.which;alert(iKeyCode);

, он дает мне предупреждения в Firefox, но не в IE и Chrome.Это дает мне все остальные символы клавиатуры, но не клавиши Esc и клавиши со стрелками.

Как я могу обнаружить клавиши Esc и клавиши со стрелками в Chrome и IE, используя JavaScript ??

Answer 1

Вам действительно не нужен JQuery, хотя это делает ваш код короче.

Вам придется использовать событие keyDown, keyPress не будет работать в старых версиях IE для клавиш со стрелками.

Здесь есть полный учебник, который вы можете использовать, см. Пример с клавишами со стрелками в нижней части страницы: http://www.cryer.co.uk/resources/javascript/script20_respond_to_keypress.htm

Вот некоторый код, который я использовал, немного упрощенный, поскольку мне приходилось обрабатывать повторные нажатия клавиш с буферизацией:

document.onkeydown = function(event) {
     if (!event)
          event = window.event;
     var code = event.keyCode;
     if (event.charCode && code == 0)
          code = event.charCode;
     switch(code) {
          case 37:
              // Key left.
              break;
          case 38:
              // Key up.
              break;
          case 39:
              // Key right.
              break;
          case 40:
              // Key down.
              break;
     }
     event.preventDefault();
};

Answer 2

Я только что столкнулся с той же проблемой.По крайней мере, есть одно отличие: Chrome обрабатывает события keypress и keydown / keyup.Событие keypress в Chrome не запускается для клавиш со стрелками, тогда как для keydown и keyup это так.

Answer 3

проблема: webkit отправляет код клавиши 38 (стрелка вверх) на нажатие клавиши, когда вы делаете shift-7 (амперсанд).

сводка: & и выше обаравно 38.% и слева оба равны 37. 'и справа оба равны 39. (и вниз оба равны 40. для firefox и opera, 37/38/39/40 не отправляются для &,%,', (.они отправляют их только для вверх, вниз, влево, вправо, но для веб-набора и, т. е. отправляют 37/38/39/40 для клавиш со стрелками и &,%, ', (. обратите внимание, что для веб-набора вверх / вниз / влево / вправоустанавливает charCode в 0, но не для &,%, ', (.

решение: , поэтому, если вы обрабатываете эти события с помощью кода клавиши, вам нужно либо игнорировать, когда клавиша Shift нажатаили проверьте, является ли charCode 0

• Лучший ресурс: http://unixpapa.com/js/key.html
• Проверьте браузер: http://asquare.net/javascript/tests/KeyCode.html
• bugs.jquery.com / ticket / 7300. "Это сделано для соответствия IE. События нажатия клавиш должны запускаться только для клавиш, вставляющих символы. Обратите внимание, что keydown / keyup срабатывает только для клавиш со стрелками."
• Интересный проект: github.com/OscarGodson/ jKey

Answer 4

Используйте jQuery и используйте что-то вроде этого:

$(document).keydown(function(e){
    if (e.keyCode == 37) { 
        alert( "left pressed" );
        return false;
    }
});

Коды символов:

37: слева

38: вверх

39: справа

40: вниз

Answer 5

Демо

Попробуйте использовать библиотеку jquery, чтобы сделать то, что вам нужно, а затем позвоните ниже. В демоверсии вы можете нажать на поле ввода, а затем начать печатать. Он предупредит вас кодом ключа. Вы можете привязать слушателя событий к любому элементу вашей страницы. Это не обязательно просто вход.

$(document).ready(function() { 
    KEY_CODES = {
      37: 'left',
      38: 'up',
      39: 'right',
      40: 'down'
    }

    KEY_STATUS = { keyDown:false };
    for (code in KEY_CODES) {
      KEY_STATUS[KEY_CODES[code]] = false;
    }

    $(window).keydown(function (e) {

      KEY_STATUS.keyDown = true;

      // perform functionality for keydown
      if (KEY_CODES[e.keyCode]) {
          e.preventDefault();
          alert('arrow');
          if(e.keyCode == 40)
          {
              // Arrow Down 
          }

          else if(e.keyCode == 39)
          {
              // Arrow Right    
          }

          else if(e.keyCode == 38)
          {
              // Arrow Up    
          }

          else if(e.keyCode == 37)
          {
              // Arrow Left    
          }

      }

    }).keyup(function (e) {
      KEY_STATUS.keyDown = false;
      if (KEY_CODES[e.keyCode]) {          
        e.preventDefault();
        KEY_STATUS[KEY_CODES[e.keyCode]] = false;
      }
    });

});

Answer 6

Это сработало для меня в Opera20 и IE8. (У меня нет Chrome для тестирования.)

var keyPressListenerFn = function(event) {
    if (!event){ event = window.event }
    var code = event.charCode && event.keyCode == 0 ? event.charCode : event.keyCode
    switch(code) {
        case 37: prev(); break // left
        case 39: next(); break // right
    }
    if (event.preventDefault){ event.preventDefault() } // opera20
    if (event.returnValue){ event.returnValue = false } // ie8
}
var addEvent = document.attachEvent ? document.attachEvent : document.addEventListener
addEvent('keydown', keyPressListenerFn)   // opera20
addEvent('onkeydown', keyPressListenerFn) // ie8

Answer 7

Вот краткая формулировка:

document.onkeydown = function(e) {
    switch (e.keyCode) {
        case 37:
            alert('left');
            break;
        case 38:
            alert('up');
            break;
        case 39:
            alert('right');
            break;
        case 40:
            alert('down');
            break;
    }
};

Однако, если вы используете JQuery, вам лучше использовать e.which, который JQuery «нормализует» для учета различий между браузерами:

$(document).keydown(function(e) {
    switch(e.which) {
        // the rest is the same