Я использую keypressслушатель, например ..
addEventListener("keypress", function(event){
}
Однако это, похоже, не обнаруживает обратного пространства, которое стирает текст ...
Могу ли я использовать другой слушатель для обнаружения этого?
Ответы:
KeyPress событие вызывается только для символа (версия для печати) ключи, KeyDown события возникают в том числе для всех непечатаемых , таких как Control, Shift, Alt, BackSpaceи т.д.
ОБНОВИТЬ:
Событие нажатия клавиши запускается, когда клавиша нажата, и эта клавиша обычно производит символьное значение
Ссылка .
Попробуйте keydownвместо keypress.
События клавиатуры происходят в следующем порядке: keydown, keyup,keypress
Проблема с обратным пространством, вероятно, заключается в том, что браузер вернется в исходное состояние, keyupи ваша страница не увидит это keypressсобытие.
keydown keypress keyup. unixpapa.com/js/testkey.html
keyupсобытие не будет запущено.
keydownсобытие, но символ не удаляется из ввода до некоторого времени после этого.
В keypressразных браузерах событие может быть разным.
Я создал Jsfiddle для сравнения событий клавиатуры (с помощью ярлыков JQuery) в Chrome и Firefox. В зависимости от браузера, который вы используете, keypressсобытие будет срабатывать или нет - backspace будет запускаться keydown/keypress/keyupв Firefox, но только keydown/keyupв Chrome.
в Chrome
keydown/keypress/keyupкогда браузер регистрирует ввод с клавиатуры ( keypressзапускается)
keydown/keyup если нет ввода с клавиатуры (проверено с помощью alt, shift, backspace, клавиш со стрелками)
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>
Что-то, что я написал на случай, если кто-то столкнется с проблемой, когда люди нажимают Backspace, думая, что они находятся в поле формы
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');
}
});
Мой числовой элемент управления:
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
Более свежие и более чистые: используйте event.key. Больше никаких произвольных цифровых кодов!
note.addEventListener('keydown', function(event) {
const key = event.key; // const {key} = event; ES6+
if (key === "Backspace") {
// Do something
}
});
.keyв настоящее время рекомендуется в документации. Кроме того, он поддерживает различные международные клавиатуры с разными сопоставлениями для любой данной клавиши. Они не произвольны в том смысле, что они фиксированы, но они есть при чтении кода
Вместо этого используйте одно из событий keyup / keydown / beforeinput.
исходя из этой ссылки, нажатие клавиш устарело и больше не рекомендуется.
Событие нажатия клавиши запускается, когда нажата клавиша, которая производит символьное значение. Примерами клавиш, которые создают символьное значение, являются буквенные, числовые и знаки препинания. Примеры клавиш, которые не производят символьное значение, - это клавиши-модификаторы, такие как Alt, Shift, Ctrl или Meta.
если вы используете "beforeinput", будьте осторожны с совместимостью с браузером . разница между «beforeinput» и двумя другими состоит в том, что «beforeinput» запускается, когда значение ввода собирается измениться, поэтому с символами, которые не могут изменить входное значение, оно не запускается (например, shift, ctr, alt).
У меня была такая же проблема, и она была решена с помощью клавиатуры.
keypressсобытия во многих браузерах. См. Unixpapa.com/js/key.html