javascript onkeypress 和 charCode 的 Firefox 问题

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16142874/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 03:25:08  来源:igfitidea点击:

Firefox issue with onkeypress and charCode

javascriptfirefox

提问by ra_ie_darkness

I am trying to restrict the user to enter only numbers in a text box

我试图限制用户只能在文本框中输入数字

<input type="text" name="pQ[]" onkeypress=" return checkKeyVal(event)"/>

function checkKeyVal(ev)
{
    if(ev.keyCode)
    {
        if(ev.keyCode<48 || ev.keyCode>57)
        {
            return false;
        }
    }
    else
    { 
        //For Firefox
        if(ev.charCode<48 || ev.charCode>57)
        {
            return false;
        }
    }
}

I found out that keyCode does not work firefox so i added charCode. The problem now is that none of other keys like backspace, delete and arrow keys seem to be working in firefox

我发现 keyCode 在 Firefox 中不起作用,所以我添加了 charCode。现在的问题是退格、删除和箭头键等其他键似乎都无法在 Firefox 中使用

回答by The Dark Knight

The way you are constructing your logic is wrong. First let us look at the ascii codes for the following characters :

你构建逻辑的方式是错误的。首先让我们看看以下字符的ascii代码:

Back Space : 10

后退空间:10

Delete : 127

删除:127

Now for the arrow keys,it depends on what operating system and programming language you are using. There is no "ASCII code" per se. The operating system detects you hit an arrow key and triggers an event that programs can capture.

现在对于箭头键,这取决于您使用的操作系统和编程语言。本身没有“ASCII 码”。操作系统检测到您点击了箭头键并触发程序可以捕获的事件。

So a normal table for the signal for such keys will look like :

因此,此类键的信号的正常表将如下所示:

                    Normal Mode            Num lock on
                 Make    Break        Make          Break
Down arrow       E0 50   E0 D0     E0 2A E0 50   E0 D0 E0 AA
Left arrow       E0 4B   E0 CB     E0 2A E0 4B   E0 CB E0 AA
Right arrow      E0 4D   E0 CD     E0 2A E0 4D   E0 CD E0 AA
Up arrow         E0 48   E0 C8     E0 2A E0 48   E0 C8 E0 AA

However, for using javascript , normally we use :

但是,对于使用 javascript ,通常我们使用:

left arrow: 37 
up arrow: 38
right arrow: 39
down arrow: 40

Now these are event.keyCode in a browser, but not ASCII codes. Refer : this url.

现在这些是浏览器中的 event.keyCode,而不是 ASCII 代码。参考:这个网址。

Lets take a look at your logic,

来看看你的逻辑

if(ev.keyCode<48 || ev.keyCode>57)
        {
            return false;
        }

so , backspace(10),left arrow(37),up arrow(38),right arrow(39),down arrow(40) are less than 48 and delete(127) is greater than 57.

所以,退格(10)、左箭头(37)、上箭头(38)、右箭头(39)、下箭头(40)小于48,删除(127)大于57。

Hence once these keys are pressed, they will return false and as such you will never see them in the UI for a key press. So what you need to do is change your condition , such that for those key presses , you get true.

因此,一旦按下这些键,它们将返回 false,因此您将永远不会在 UI 中看到它们进行按键按下。所以你需要做的是改变你的条件,这样对于那些按键,你就会得到真实的。

Note :

笔记 :

You probably can make use of this code , which i normally use for java script purposes :

您可能可以使用此代码,我通常将其用于 Java 脚本目的:

function isNumber(event){
  var charCode = (event.which) ? event.which : event.keyCode;
  if (charCode > 31 && (charCode < 48 || charCode > 57))
   return false;
 return true;
}

I have tested this puppy in IE 7, 8 , MF and chrome. Seems to work seamlessly every where. However, if there is some key press event that you want recorded explicitly for your self, then look up the event code in google and then block/un block it . Cheers !

我已经在 IE 7、8、MF 和 chrome 中测试了这只小狗。似乎可以在任何地方无缝工作。但是,如果您想为自己明确记录某些按键事件,请在 google 中查找事件代码,然后阻止/取消阻止它。干杯!

回答by Mathijs Flietstra

The problem is that you are using the keypressevent, switch to keyupor keydown. Then keyCodewill start working for you in Firefox as well. Have a look at this Quirksmode articlefor some more information on browser behaviour with keystroke detection.

问题是您正在使用该keypress事件,切换到keyupkeydown。然后keyCode也将开始在 Firefox 中为您工作。查看这篇Quirksmode 文章,了解更多有关使用击键检测的浏览器行为的信息。

<input type="text" name="pQ[]" onkeyup="return checkKeyVal(event)"/>