Как узнать, является ли .keyup() символьным ключом (jQuery)
$("input").keyup(function() {
if (key is a character) { //such as a b A b c 5 3 2 $ # ^ ! ^ * # ...etc not enter key or shift or Esc or space ...etc
/* Do stuff */
}
});
Как узнать, является ли .keyup() символьным ключом (jQuery)
$("input").keyup(function() {
if (key is a character) { //such as a b A b c 5 3 2 $ # ^ ! ^ * # ...etc not enter key or shift or Esc or space ...etc
/* Do stuff */
}
});
Примечание. В ретроспективе это был быстрый и грязный ответ, который может работать не во всех ситуациях. Чтобы получить надежное решение, см. ответ тим Дауна (скопируйте его здесь, поскольку этот ответ по-прежнему получает мнения и отзывы):
Вы не можете сделать это надежно с событием keyup. Если вы хотите знать что-то о персонаже, который был напечатан, вы должны использовать событие нажатия клавиши вместо этого.
Следующий пример будет работать все время в большинстве браузеров, но Есть некоторые крайние случаи, о которых вы должны знать. Для чего в мой взгляд, полное руководство по этому вопросу, см. http://unixpapa.com/js/key.html.
$("input").keypress(function(e) { if (e.which !== 0) { alert("Character was typed. It was: " + String.fromCharCode(e.which)); } });
keyup
иkeydown
дают вам информацию о физическом ключе, который был нажат. На стандартных клавиатурах США/Великобритании в их стандартных раскладках это похоже, что есть корреляция между свойствомkeyCode
эти события и характер, который они представляют. Однако это не надежно: разные раскладки клавиатуры будут иметь разные сопоставления.
Ниже приведен первоначальный ответ, но он не является правильным и может работать не надежно во всех ситуациях.
Чтобы сопоставить код клавиши с символом слова (например, a
будет соответствовать. space
не будет)
$("input").keyup(function(event)
{
var c= String.fromCharCode(event.keyCode);
var isWordcharacter = c.match(/\w/);
});
Хорошо, это был быстрый ответ. Подход тот же, но остерегайтесь проблем с кодом ключа, см. эту статью в режиме quirksmode.
Вы не можете сделать это надежно с событием keyup
. Если вы хотите узнать что-то о введенном символе, вы должны использовать событие keypress
.
Следующий пример будет работать все время в большинстве браузеров, но есть некоторые крайние случаи, о которых вы должны знать. Для того, что, на мой взгляд, является окончательным руководством по этому вопросу, см. http://unixpapa.com/js/key.html.
$("input").keypress(function(e) {
if (e.which !== 0) {
alert("Charcter was typed. It was: " + String.fromCharCode(e.which));
}
});
keyup
и keydown
предоставляют информацию о физическом нажатии клавиши. На стандартных клавиатурах США/Великобритании в стандартных макетах, похоже, существует корреляция между свойством keyCode
этих событий и характером, который они представляют. Однако это ненадежно: разные раскладки клавиатуры будут иметь разные сопоставления.
Я не совсем удовлетворен другими ответами. У них у всех есть какой-то недостаток.
Использование keyPress
с event.which
ненадежно, потому что вы не можете поймать возврат или удаление (как упомянуто Тарлом).
Использование keyDown
(как в ответах Niva и Tarl) немного лучше, но решение имеет недостатки, поскольку оно пытается использовать event.keyCode
с String.fromCharCode()
(keyCode и charCode не совпадают!).
Однако то, что мы ДЕЛАЕМ с событием keydown
или keyup
, является фактической нажатой клавишей (event.key
).
Насколько я могу судить, любой key
длиной 1 является символом (цифрой или буквой) независимо от того, какую языковую клавиатуру вы используете. Пожалуйста, поправьте меня, если это не так!
Тогда этот очень длинный ответ из asdf. Это может сработать отлично, но это кажется излишним.
Итак, вот простое решение, которое будет ловить все символы, возвращать и удалять. (Примечание: здесь keyup
или keydown
будут работать, но keypress
не будет)
$("input").keydown(function(event) {
var isWordCharacter = event.key.length === 1;
var isBackspaceOrDelete = event.keyCode === 8 || event.keyCode === 46;
if (isWordCharacter || isBackspaceOrDelete) {
// do something
}
});
Это помогло мне:
$("#input").keyup(function(event) {
//use keyup instead keypress because:
//- keypress will not work on backspace and delete
//- keypress is called before the character is added to the textfield (at least in google chrome)
var searchText = $.trim($("#input").val());
var c= String.fromCharCode(event.keyCode);
var isWordCharacter = c.match(/\w/);
var isBackspaceOrDelete = (event.keyCode == 8 || event.keyCode == 46);
// trigger only on word characters, backspace or delete and an entry size of at least 3 characters
if((isWordCharacter || isBackspaceOrDelete) && searchText.length > 2)
{ ...
Если вам нужно только исключить ключи enter
, escape
и spacebar
, вы можете сделать следующее:
$("#text1").keyup(function(event) {
if (event.keyCode != '13' && event.keyCode != '27' && event.keyCode != '32') {
alert('test');
}
});
Вы можете сослаться на полный список кодов клавиш здесь для дальнейшей модификации.
Я хотел сделать именно это, и я подумал о решении, включающем как keyup, так и нажатие.
(Я не тестировал его во всех браузерах, но я использовал информацию, собранную в http://unixpapa.com/js/key.html)
Изменить: переписал его как плагин jQuery.
(function($) {
$.fn.normalkeypress = function(onNormal, onSpecial) {
this.bind('keydown keypress keyup', (function() {
var keyDown = {}, // keep track of which buttons have been pressed
lastKeyDown;
return function(event) {
if (event.type == 'keydown') {
keyDown[lastKeyDown = event.keyCode] = false;
return;
}
if (event.type == 'keypress') {
keyDown[lastKeyDown] = event; // this keydown also triggered a keypress
return;
}
// 'keyup' event
var keyPress = keyDown[event.keyCode];
if ( keyPress &&
( ( ( keyPress.which >= 32 // not a control character
//|| keyPress.which == 8 || // \b
//|| keyPress.which == 9 || // \t
//|| keyPress.which == 10 || // \n
//|| keyPress.which == 13 // \r
) &&
!( keyPress.which >= 63232 && keyPress.which <= 63247 ) && // not special character in WebKit < 525
!( keyPress.which == 63273 ) && //
!( keyPress.which >= 63275 && keyPress.which <= 63277 ) && //
!( keyPress.which === event.keyCode && // not End / Home / Insert / Delete (i.e. in Opera < 10.50)
( keyPress.which == 35 || // End
keyPress.which == 36 || // Home
keyPress.which == 45 || // Insert
keyPress.which == 46 || // Delete
keyPress.which == 144 // Num Lock
)
)
) ||
keyPress.which === undefined // normal character in IE < 9.0
) &&
keyPress.charCode !== 0 // not special character in Konqueror 4.3
) {
// Normal character
if (onNormal) onNormal.call(this, keyPress, event);
} else {
// Special character
if (onSpecial) onSpecial.call(this, event);
}
delete keyDown[event.keyCode];
};
})());
};
})(jQuery);
Мне никогда не нравилась проверка кода ключа. Мой подход состоял в том, чтобы увидеть, есть ли на вводе текст (любой символ), подтверждающий, что пользователь вводит текст, а не другие символы
$('#input').on('keyup', function() {
var words = $(this).val();
// if input is empty, remove the word count data and return
if(!words.length) {
$(this).removeData('wcount');
return true;
}
// if word count data equals the count of the input, return
if(typeof $(this).data('wcount') !== "undefined" && ($(this).data('wcount') == words.length)){
return true;
}
// update or initialize the word count data
$(this).data('wcount', words.length);
console.log('user tiped ' + words);
// do you stuff...
});
<html lang="en">
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<input type="text" name="input" id="input">
</body>
</html>