Який код ключа для втечі з jQuery

У мене дві функції. При натисканні клавіші введення функції запускаються правильно, але при натисканні клавіші введення не відбувається. Яке правильне число ключа для втечі?

$(document).keypress(function(e) { 
    if (e.which == 13) $('.save').click();   // enter (works as expected)
    if (e.which == 27) $('.cancel').click(); // esc   (does not work)
});

Спробуйте з подією клавіатури :

$(document).keyup(function(e) {
  if (e.keyCode === 13) $('.save').click();     // enter
  if (e.keyCode === 27) $('.cancel').click();   // esc
});

Замість того, щоб вводити жорсткі коди значень ключового коду у вашій функції, подумайте про використання названих констант, щоб краще передати своє значення:

var KEYCODE_ENTER = 13;
var KEYCODE_ESC = 27;

$(document).keyup(function(e) {
  if (e.keyCode == KEYCODE_ENTER) $('.save').click();
  if (e.keyCode == KEYCODE_ESC) $('.cancel').click();
});

Деякі браузери (наприклад, FireFox, не впевнені в інших) визначають глобальний KeyEventоб'єкт, який виставляє ці типи констант для вас. Це запитання ТА показує хороший спосіб визначення цього об'єкта і в інших браузерах.

(Відповідь вилучена з мого попереднього коментаря )

Вам потрібно використовувати, keyupа не keypress. наприклад:

$(document).keyup(function(e) {
  if (e.which == 13) $('.save').click();     // enter
  if (e.which == 27) $('.cancel').click();   // esc
});

keypressСхоже, не обробляється послідовно між веб-переглядачами (спробуйте демонстрацію на веб-сайті http://api.jquery.com/keypress в IE vs Chrome vs Firefox. Іноді keypressне реєструється, і значення "і", і " keyCode 'змінюється), тоді як keyupє послідовним.

Оскільки було обговорено e.whichvs e.keyCode: Зауважте, що e.whichце нормалізоване значення jquery і є рекомендованим для використання:

Властивість event.wich нормалізує event.keyCode та event.charCode. Рекомендується переглянути event.which для клавіш клавіатури.

(від http://api.jquery.com/event.which/ )

Щоб знайти код коду для будь-якої клавіші, використовуйте цю просту функцію:

document.onkeydown = function(evt) {
    console.log(evt.keyCode);
}

27- код ключа для втечі. :)

Ваша найкраща ставка

$(document).keyup(function(e) { 
    if (e.which === 13) $('.save').click();   // enter 
    if (e.which === 27) $('.cancel').click(); // esc   

    /* OPTIONAL: Only if you want other elements to ignore event */
    e.preventDefault();
    e.stopPropagation();
});

Підсумок

• whichє більш кращим, ніж keyCodeтому, що він нормалізується
• keyupє більш кращим, ніж keydownтому, що натискання клавіш може відбуватися кілька разів, якщо користувач натискає його.
• Не використовуйте, keypressякщо ви не хочете захоплювати фактичних символів.

Цікаво, що Bootstrap використовує keydown та keyCode у своєму спадному компоненті (станом на 3.0.2)! Я думаю, що це, мабуть, поганий вибір.

Зв’язаний фрагмент від JQuery doc

Хоча браузери використовують різні властивості для зберігання цієї інформації, jQuery нормалізує властивість .which, щоб ви могли надійно використовувати її для отримання ключового коду. Цей код відповідає клавіші на клавіатурі, включаючи коди для спеціальних клавіш, таких як стрілки. Для введення фактичного введення тексту, .keypress () може бути кращим вибором.

Інші цікаві місця: Бібліотека JavaScript Keypress

Спробуйте плагін jEscape ( завантажити з Google Drive )

$(document).escape(function() { 
   alert('ESC button pressed'); 
});

або отримати ключовий код для крос-браузера

var code = (e.keyCode ? e.keyCode : e.which);
if (code === 27) alert('ESC');
if (code === 13) alert('ENTER');

можливо, ви можете використовувати перемикач

var code = (e.keyCode ? e.keyCode : e.which);
switch (code) {
    case 27:
       alert('ESC');
       break;
     case 13:
       alert('ENTER');
       break;
}

Ваш код працює чудово. Це, швидше за все, вікно, яке не зосереджене. Я використовую подібну функцію, щоб закрити рамки iframe тощо.

$(document).ready(function(){

    // Set focus
    setTimeout('window.focus()',1000);

});

$(document).keypress(function(e) {

    // Enable esc
    if (e.keyCode == 27) {
      parent.document.getElementById('iframediv').style.display='none';
      parent.document.getElementById('iframe').src='/views/view.empty.black.html';
    }

});

Я намагався зробити те ж саме, і це виривало з мене лайно. У Firefox виявляється, що якщо ви намагаєтеся робити деякі речі, коли натискається клавіша втечі, вона продовжує обробляти клавішу втечі, яка потім скасовує все, що ви намагалися зробити. Сповіщення працює чудово. Але в моєму випадку я хотів повернутися в історію, яка не спрацювала. Нарешті з'ясував, що я повинен змусити розповсюдження події припинити, як показано нижче ...

if (keyCode == 27)
{
    history.back();

    if (window.event)
    {
        // IE works fine anyways so this isn't really needed
        e.cancelBubble = true;
        e.returnValue = false;
    }
    else if (e.stopPropagation)
    {
        // In firefox, this is what keeps the escape key from canceling the history.back()
        e.stopPropagation();
        e.preventDefault();
    }

    return (false);
}

Пояснити, де інших відповідей немає; проблема полягає у вашому використанні keypress.

Можливо , ця подія є просто неправильно названо , але keypressвизначається при пожежі . Тобто текст. Тоді як те, що ви хочете, є / , яке спрацьовує щоразу (до або після, відповідно) . Тобто ті речі на клавіатурі.when an actualcharacteris being inserted
keydownkeyupthe user depresses akey

Різниця тут з'являється через те, що escвона є контрольним символом (буквально "недрукарським символом") і тому не пише жодного тексту, таким чином навіть не запускаючи keypress.
enterце дивно, тому що, навіть якщо ви використовуєте його як керуючий символ (тобто для управління інтерфейсом користувача), він все одно вставляє символ нового рядка, який запустить keypress.

Джерело: quirksmode

Щоб отримати шістнадцятковий код для всіх символів: http://asciitable.com/

Лише розміщення оновленої відповіді, ніж e.keyCodeвважається ВИДАЛЕНО в MDN .

Швидше ви повинні вибрати для e.keyцього, який підтримує чисті імена для всього. Ось відповідна паста для копіювання

window.addEventListener("keydown", function (event) {
  if (event.defaultPrevented) {
    return; // Do nothing if the event was already processed
  }

  switch (event.key) {
    case "ArrowDown":
      // Do something for "down arrow" key press.
      break;
    case "ArrowUp":
      // Do something for "up arrow" key press.
      break;
    case "ArrowLeft":
      // Do something for "left arrow" key press.
      break;
    case "ArrowRight":
      // Do something for "right arrow" key press.
      break;
    case "Enter":
      // Do something for "enter" or "return" key press.
      break;
    case "Escape":
      // Do something for "esc" key press.
      break;
    default:
      return; // Quit when this doesn't handle the key event.
  }

  // Cancel the default action to avoid it being handled twice
  event.preventDefault();
}, true);

Надійна бібліотека Javascript для фіксації вводу клавіатури та введених комбінацій клавіш. Він не має залежностей.

http://jaywcjlove.github.io/hotkeys/

hotkeys('enter,esc', function(event,handler){
    switch(handler.key){
        case "enter":$('.save').click();break;
        case "esc":$('.cancel').click();break;
    }
});

гарячі клавіші розуміють такі модифікатори: ⇧, shiftoption⌥altctrlcontrolcommandі ⌘.

Наступні спеціальні клавіші можна використовувати для швидкого доступу: backspacetab, clear, enter, return, esc, escape, space, up, down, left, right, home, end, pageup, pagedown, del, deleteі f1через f19.

Я завжди використовував клавіатуру і, наприклад, для того, щоб зловити ключ втечі.

Я знаю, що це питання задає питання про jquery, але для тих, хто використовує jqueryui, є константи для багатьох клавішних кодів:

$.ui.keyCode.ESCAPE

http://api.jqueryui.com/jQuery.ui.keyCode/