在 keypress jquery 功能上，退格不起作用答案

【问题标题】：on keypress jquery function, backspace doesn't work在 keypress jquery 功能上，退格不起作用
【发布时间】：2016-07-20 16:02:55
【问题描述】：

我实现了一个自动添加空格的功能：

+33 6 XX XX XX XX

或

06 XX XX XX XX

这是脚本：

$('#num').keypress(function(){
    $this = $(this);
    //remove whitespaces to calculate the length of the string
    $val = $this.val().replace(/\s+/g, '');
    //if it's the case '+33 6 XX XX XX XX
    if ($val.toLowerCase().indexOf("+") >= 0 | $val == "")
    {
     if($val.length == 3){
            $this.val($this.val() + " ");
        }else if($val.length == 4){
            $this.val($this.val() + " ");
        }else if ($val.length >= 5 && ($val.length)%2 == 0){
            $this.val($this.val() + " ");
        }
    }else{
         if (($val.length)%2 == 0){
            $this.val($this.val() + " ");
        }
    }

});

它在 chrome 上完美运行，但在 Firefox 上我无法退格输入。有什么想法吗？

这是一个 jsfiddle 来说明：

https://jsfiddle.net/jd1mwp3p/

【问题讨论】：

请注意，从用户体验的角度来看，它在 Chrome 中也不起作用。一个例子 - 输入一个数字，意识到你已经调换了两位数。选择它们并尝试以正确的方式重写它们 - 随之而来的是奇怪。
哦，对了，没试过这个......这很奇怪我做错了什么？

标签： javascript jquery keypress onkeypress

【解决方案1】：

您需要过滤不可打印的按键事件，以防浏览器触发它们。

例如，退格：

$('#num').keypress(function(e) {
  if(e.keyCode == 8) {
    return true;
  }
  $this = $(this);
  // etc.
}

【讨论】：

【解决方案2】：

使用.keydown，您不必担心检查是否退格！因为它适用于任何按下的键。

【讨论】：

【解决方案3】：

这里有两件事要考虑。

第一个是不同的浏览器对keypress、keyup、keydown的处理方式不同。特别是当涉及到不可打印的字符时，例如退格，一些浏览器会触发 keypress 事件，而有些则不会。 Firefox 有，而 Chrome 没有。

现在，如果您查看代码，则不会考虑退格。实际上，如果没有 + 符号并且值为偶数，您所做的就是添加一个空格：

else{
         if (($val.length)%2 == 0){
            $this.val($this.val() + " ");
        }
    }

如果值是 3 4 或 5 个字符长且有 + 或值为空，则再次添加空格：

if ($val.toLowerCase().indexOf("+") >= 0 | $val == "")
    {
     if($val.length == 3){
            $this.val($this.val() + " ");
        }else if($val.length == 4){
            $this.val($this.val() + " ");
        }else if ($val.length >= 5 && ($val.length)%2 == 0){
            $this.val($this.val() + " ");
        }
    }

所以。 Chrome 会忽略您的按键事件并仅删除字符，firefox 会调用您的事件并且您不处理退格键。

【讨论】：

谢谢，但这不是答案！ keypresss 功能不允许处理不可打印的键，如退格...
退格键码应为 8，删除键码应为 46。正如我提到的，并非所有浏览器都在退格键上调用 keypress，所以我可能会使用 keyup
你甚至可以保持这样，如果 keycode 为 8，则放一个 if 语句返回。不触发事件的浏览器仍然可以工作，并且会返回的浏览器
@BaptisteArnaud，你觉得这有帮助吗？你找到另一个解决方案了吗？如果您解决了，请接受答案或让我们知道您找到了什么解决方案
就像你说的那样，我用键码 8 处理了退格键。谢谢伙计！