JavaScript KeyCode против CharCode

Question

Проблема:

• Предельные допустимые символы в HTML ввода в только-Z A-Z.
• Для бизнес-требований это необходимо сделать на KeyPress, чтобы символ просто не позволял даже отображаться на входе.
• Вкладка, ввод, стрелки, обратное пространство, сдвиг разрешены. Пользователь должен иметь возможность свободно перемещаться в и из текстового поля, удаление символов и т.д. и т.п.

Это отправная точка моего кода ...

var keyCode = (e.keyCode ? e.keyCode : e.which); 

Однако каждое значение, которое я получаю в keyCode не соответствует любым символьным графикам, которые я видел в Интернете. Например, символ «h» дает мне код возврата 104.

Является ли KeyCode отличным от CharCode? Какой код содержит контрольные символы? Нужно ли преобразовать?

Как я могу ограничить ввод a-z A-Z и разрешить ключи, которые мне нужны в JavaScript?

Answer 1

Ответы на все ваши вопросы можно найти на the following page.

... но в итоге:

• Единственное событие, из которого можно надежно получить информацию о персонаже (в отличие от ключевой информации кода) является keypress событие.
• В мероприятии keypress все браузеры, кроме IE < = 8, хранят код символа в объекте which. Большинство, но не все из этих браузеров также сохраняют код символа в свойстве charCode.
• В мероприятии keypress IE < = 8 хранит код символа в свойстве keyCode.

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

var charCode = (typeof e.which == "number") ? e.which : e.keyCode 

Это обычно возвращает Вы код символа, где он существует, и 0 в противном случае. Есть несколько случаев, когда вы получите ненулевое значение, когда вы не должны:

• В Opera < 10,50 для ключей Вставки, Удалить, Главной и Конца
• В последних версиях Konqueror для несимметричных клавиш.

Обходной путь для первой проблемы немного связан и требует использования события keydown.

Answer 2

Я думаю, что keyCode возвращает значение ключа ASCII, Ascii-104 - h.

http://www.asciitable.com/

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

Вот статья с примера crssbrowser: http://santrajan.blogspot.com/2007/03/cross-browser-keyboard-handler.html

Answer 3

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

onKeyUp и onKeyDown имеют одинаковые коды символов для букв верхнего и нижнего регистра. Он рекомендовал бы использовать onKeyUp, потому что он ближе всего к onKeyPress

Answer 4

/* Вы не получите keyCode при нажатии клавиши для непечатаемых клавиш, , почему бы не захватить их вместо keydown? */

function passkeycode(e){ 
    e= e || window.event; 
    var xtrakeys={ 
     k8: 'Backspace', k9: 'Tab', k13: 'Enter', k16: 'Shift', k20: 'Caps Lock', 
     k35: 'End', k36: 'Home', k37: 'Ar Left', k38: 'Ar Up', k39: 'Ar Right', 
     k40: 'Ar Down', k45: 'Insert', k46: 'Delete' 
    }, 
    kc= e.keyCode; 
    if((kc> 64 && kc<91) || xtrakeys['k'+kc]) return true; 
    else return false; 
} 

inputelement.onkeydown=passkeycode; 

кс> 6 & кс < 91 // A-Za-Z

xtrakeys [ 'к' + целое число]) определяет специальные коды клавиш позволило

Answer 5

Я думаю, что вы» полностью неверный подход. Как насчет чего-то типа:

<input id="test"> 

<script type="text/javascript"> 
var aToZ = function(el){ 
    if(this.value.match(/[^a-zA-Z]/)){ 
     this.value = this.value.replace(/[^a-zA-Z]+/, '') 
    } 
} 
document.getElementById("test").onkeyup = aToZ 
</script> 

Кроме того, не забудьте также повторить проверку на стороне сервера.

Answer 6

На самом деле, 104 является кодом ASCII для нижнего регистра «h». Чтобы получить код ASCII типизированного символа onkeypress, вы можете просто использовать e.which || e.keyCode, и вам не нужно беспокоиться о удерживаемых клавишах, потому что для введенного текста нажатие клавиши автоматически повторяется во всех браузерах (в соответствии с отличным http://unixpapa.com/js/key.html).

Так все, что вам действительно нужно:

<input id="textbox"> 

<script type="text/javascript"> 
document.getElementById('textbox').onkeypress = function(e){ 
    var c = e.which || e.keyCode; 
    if((c > 31 && c < 65) || (c > 90 && c < 97) || (c > 122 && c !== 127)) 
    return false; 
}; 
</script> 

Попробуйте: http://jsfiddle.net/wcDCJ/1/

(коды ASCII взяты из http://en.wikipedia.org/wiki/Ascii)

Answer 7

Хорошее горе. KeyboardEvent. [Key, char, keyCode, charCode, которые] все устарели или в настоящее время имеют выдающиеся ошибки в соответствии с документами API Mozilla - https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent. Даже JQuery передает доллар на этом и позволяет пользователю определить его https://api.jquery.com/keydown/.

Answer 8

Вот пример разметки:

<form id="formID"> 
    <input type="text" id="filteredInput"> 
    <input type="text" id="anotherInput"> 
</form> 

следующая логика может быть использована для ловушки для ввода с клавиатуры (в данном случае, с помощью документа JQuery готовые обертки).

Это может показаться немного глупым, но в основном я проверяю все, что я хочу разрешить (в вашем случае буквы от A до Z нечувствительны) и ничего не делать. Другими словами, действие по умолчанию разрешено, но любой вход, отличный от альфа, предотвращается.

Стандартная навигация по клавиатуре, такая как клавиши со стрелками, «Домой», «Конец», «Вкладка», «Назад», «Удалить» и т. Д., Проверяется и разрешается.

ПРИМЕЧАНИЕ. Этот код был первоначально написан для обеспечения пользовательского ввода, допускающего только буквенно-цифровые значения (A - Z, a - z, 0 - 9), и я оставил эти строки целыми в качестве комментариев.

 <script> 
      jQuery(document).ready(function() { 

       // keydown is used to filter input 
       jQuery("#formID input").keydown(function(e) { 
        var _key = e.which 
         , _keyCode = e.keyCode 
         , _shifted = e.shiftKey 
         , _altKey = e.altKey 
         , _controlKey = e.ctrlKey 
        ; 
        //console.log(_key + ' ' + _keyCode + ' ' + _shifted + ' ' + _altKey + ' ' + _controlKey); 

        if(this.id === jQuery('#filteredInput').prop('id')) { 
         if(
          // BACK,   TAB 
          (_key === 8 || _key === 9) // normal keyboard nav 
         ){} 

         else if(
          // END,   HOME,   LEFT,   UP,   RIGHT,   DOWN 
          (_key === 35 || _key === 36 || _key === 37 || _key === 38 || _key === 39 || _key === 40) // normal keyboard nav 
         ){} 

         else if(
          // DELETE 
          (_key === 46) // normal keyboard nav 
         ){} 

         else if(
          (_key >= 65 && _key <= 90) // a- z 

          //(_key >= 48 && _key <= 57 && _shifted !== true) || // 0 - 9 (unshifted) 
          //(_key >= 65 && _key <= 90) ||      // a- z 
          //(_key >= 96 && _key <= 105)       // number pad 0- 9 
         ){} 

         else { 
          e.preventDefault(); 
         } 
        } 

       }); 
      }); 
     </script>