Question

问题：

将HTML输入中允许的字符限制为仅限a-z A-Z。
对于业务需求，这需要在KeyPress上完成，这样才不会让角色出现在输入中。
Tab，enter，arrows，backspace，shift都是允许的。用户必须能够自由地移入和移出文本框，删除字符等等。

这是我的代码的起点......

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＆lt; = 8之外的所有浏览器都将字符代码存储在事件的which属性中。大多数但不是所有这些浏览器也将字符代码存储在charCode属性中。
在keypress事件中，IE＆lt; = 8将字符代码存储在keyCode属性中。

这意味着要获取与按键相对应的字符代码，假设按键事件对象存储在名为e的变量中，以下内容将随处可用：

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

这通常会返回一个存在字符的字符代码，否则返回0。在某些情况下，如果不这样做，您将获得非零值：

在Opera＆lt; 10.50为键插入，删除，主页和结束
最新版本的Konqueror用于非字符键。

第一个问题的解决方法有点涉及，并且还需要使用keydown事件。

Answer 2

好悲伤。根据Mozilla的API文档https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent，KeyboardEvent。[key，char，keyCode，charCode，all]已被弃用或目前有明显的错误。甚至JQuery也会在这个问题上贬低，让用户弄明白https://api.jquery.com/keydown/。

Answer 3

实际上，104是小写'h'的ASCII码。要获取键入的字符onkeypress的ASCII代码，您可以使用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 4

onKeyPress有大写和小写字母的不同代码。您可能会发现打开上限锁然后键入您的信件会为您提供您期望的代码

onKeyUp和onKeyDown对于大写和小写字母具有相同的字符代码。它建议使用onKeyUp，因为它最接近onKeyPress

Answer 5

/ * 对于非打印键，你不会在keypress上获得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;

KC＆GT; 64＆amp;＆amp; kc＆lt; 91 // a-zA-Z

xtrakeys ['k'+ integer]）定义了允许的特殊密钥代码

Answer 6

以下是示例标记：

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

以下逻辑可用于捕获键盘输入（在本例中，通过jQuery文档就绪包装器）。

它可能看起来有点傻，但基本上，我检查我想要允许的一切（在你的情况下，字母A到Z不区分大小写）和什么都不做。换句话说，允许使用默认操作，但会阻止除alpha之外的任何输入。

检查并允许标准键盘导航，例如箭头键，Home，End，Tab，Backspace，Delete等。

注意：此代码最初是为满足用户输入而编写的，只允许使用字母数字值（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>

Answer 7

我认为keyCode返回ASCII键值，Ascii-104是h。

http://www.asciitable.com/

Charcode就像另一个答案中所述，是某些浏览器中使用的替代方案。

以下是一篇包含crssbrowser示例的文章：http://santrajan.blogspot.com/2007/03/cross-browser-keyboard-handler.html

Answer 8

我认为你完全采取了错误的做法。怎么样：

<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>

另外，不要忘记重复检查服务器端。

JavaScript KeyCode与CharCode

8 个答案: