Слушатель JavaScript, «нажатие клавиши» не обнаруживает возврат?

Question

Я использую keypress слушатель, например ..

addEventListener("keypress", function(event){

}

Однако, похоже, это не обнаруживает возврат, который стирает текст ...

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

Answer 1

Событие KeyPress вызывается только для символьных (печатаемых) клавиш, событие KeyDown вызывается для всех, включая непечатаемые, например Control , Shift , Alt , BackSpace и т. Д.

ОБНОВЛЕНИЕ:

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

Ссылка .

Answer 2

Попробуйте keydown вместо keypress.

События клавиатуры происходят в следующем порядке: keydown, keyup, keypress

Проблема с backspace, вероятно, заключается в том, что браузер вернется на keyup и, следовательно, ваша страница не увидит событие keypress.

Answer 3

Событие keypress может отличаться в разных браузерах.

Я создал Jsfiddle для сравнения событий клавиатуры (используя ярлыки JQuery) в Chrome и Firefox. В зависимости от того, какой браузер вы используете, событие keypress будет вызвано или нет - backspace вызовет keydown/keypress/keyup в Firefox, но только keydown/keyup в Chrome.

События, вызванные одним нажатием клавиши

на Chrome

• keydown/keypress/keyup когда браузер регистрирует ввод с клавиатуры (keypress срабатывает)

• keydown/keyup если нет ввода с клавиатуры (проверено клавишами alt, shift, backspace, arrow)

• keydown только для табуляции?

на Firefox

• keydown/keypress/keyup когда браузер регистрирует ввод с клавиатуры, но также для возврата, клавиш со стрелками, вкладки (так что здесь keypress запускается даже без ввода)

• keydown/keyup для alt, shift

---

Это не должно удивлять, потому что согласно https://api.jquery.com/keypress/:

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

Использование типа события нажатия клавиши не рекомендуется W3C (http://www.w3.org/TR/DOM-Level-3-Events/#event-type-keypress)

Тип события нажатия клавиши определен в данной спецификации для справки. и полнота, но эта спецификация не одобряет использование этого тип события. При редактировании контексты авторы могут подписаться на вместо события beforeinput.

---

Наконец, чтобы ответить на ваш вопрос, вы должны использовать keyup или keydown для обнаружения возврата в Firefox и Chrome.

---

Попробуйте здесь:

$(".inputTxt").bind("keypress keyup keydown", function (event) {
    var evtType = event.type;
    var eWhich = event.which;
    var echarCode = event.charCode;
    var ekeyCode = event.keyCode;

    switch (evtType) {
        case 'keypress':
            $("#log").html($("#log").html() + "<b>" + evtType + "</b>" + " keycode: " + ekeyCode + " charcode: " + echarCode + " which: " + eWhich + "<br>");
            break;
        case 'keyup':
            $("#log").html($("#log").html() + "<b>" + evtType + "</b>" + " keycode: " + ekeyCode + " charcode: " + echarCode + " which: " + eWhich + "<p>");
            break;
        case 'keydown':
            $("#log").html($("#log").html() + "<b>" + evtType + "</b>" + " keycode: " + ekeyCode + " charcode: " + echarCode + " which: " + eWhich + "<br>");
            break;
        default:
            break;
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input class="inputTxt" type="text" />
<div id="log"></div>

Answer 4

Что-то, что я написал, когда кто-нибудь сталкивался с проблемой попадания людей в забой, думая, что они находятся в поле формы

window.addEventListener("keydown", function(e){
    /*
     * keyCode: 8
     * keyIdentifier: "U+0008"
    */
    if(e.keyCode === 8 && document.activeElement !== 'text') {
        e.preventDefault();
        alert('Prevent page from going back');
    }
});

Answer 5

Мой числовой элемент управления:

function CheckNumeric(event) {
    var _key = (window.Event) ? event.which : event.keyCode;
    if (_key > 95 && _key < 106) {
        return true;
    }
    else if (_key > 47 && _key < 58) {
        return true;
    }
    else {
        return false;
    }
}

<input type="text" onkeydown="return CheckNumerick(event);" />

попробуйте

Код клавиши BackSpace - 8

Answer 6

event.key === "Backspace"

Более новый и более чистый: используйте event.key.Больше никаких кодов произвольных чисел!

note.addEventListener('keydown', function(event) {
    const key = event.key; // const {key} = event; ES6+
    if (key === "Backspace") {
        // Do something
    }
});

Документы Mozilla

Поддерживаемые браузеры