为什么类型为 "number" 的 html 输入允许在字段中输入字母 'e'？

Question

我有以下 html5 输入元素：

<input type="number">

为什么此输入允许在输入字段中输入字符 'e'？无法输入其他字母字符（如预期）

使用 chrome v. 44.0.2403.107

下面的例子明白我的意思。

<input type="number">

Answer 1

因为 the spec says it should work. The number input can accept floating-point numbers 就是这样，包括负号和 e 或 E 字符（其中指数是 e 或 [=11 之后的数字=]):

A floating-point number consists of the following parts, in exactly the following order:

Optionally, the first character may be a "-" character.

One or more characters in the range "0—9".

Optionally, the following parts, in exactly the following order:

a "." character

one or more characters in the range "0—9"

Optionally, the following parts, in exactly the following order:

a "e" character or "E" character

optionally, a "-" character or "+" character

One or more characters in the range "0—9".

Answer 2

<input type="number" onkeydown="return FilterInput(event)" onpaste="handlePaste(event)"  >

function FilterInput(event) {
    var keyCode = ('which' in event) ? event.which : event.keyCode;

    isNotWanted = (keyCode == 69 || keyCode == 101);
    return !isNotWanted;
};
function handlePaste (e) {
    var clipboardData, pastedData;

    // Get pasted data via clipboard API
    clipboardData = e.clipboardData || window.clipboardData;
    pastedData = clipboardData.getData('Text').toUpperCase();

    if(pastedData.indexOf('E')>-1) {
        //alert('found an E');
        e.stopPropagation();
        e.preventDefault();
    }
};

Answer 3

我们可以像下面这样简单

<input type="number"  onkeydown="javascript: return event.keyCode == 69 ? false : true" />

更新答案

我们可以按照 @88 MPG 的建议让它变得更简单

<input type="number" onkeydown="return event.keyCode !== 69" />

Answer 4

HTML 输入数字类型允许 "e/E" 因为 "e" 代表指数，它是一个数字符号。

例子200000也可以写成2e5。我希望这有助于感谢你的问题。

Answer 5

强制使用仅由数字组成的号码的最佳方法：

<input type="number" onkeydown="javascript: return ['Backspace','Delete','ArrowLeft','ArrowRight'].includes(event.code) ? true : !isNaN(Number(event.key)) && event.code!=='Space'" />

这避免了 'e'、'-'、'+'、'.' ...所有不是数字的字符！

要仅允许数字键，请使用 Number 函数转换为数字。如果这不是数字，则结果为 NaN :

isNaN(Number(event.key))

但接受退格键、删除键、左箭头、右箭头：

['Backspace','Delete','ArrowLeft','ArrowRight'].includes(event.code)

这适用于允许空格的 Firefox :

event.code!=='Space'

Answer 6

要同时隐藏字母 e 和减号 -，只需执行：

onkeydown="return event.keyCode !== 69 && event.keyCode !== 189"

Answer 7

使用angular，你可以这样做来限制输入e,+,-,E

 <input type="number"  (keypress)="numericOnly($event)"/>


  numericOnly(event): boolean { // restrict e,+,-,E characters in  input type number
    debugger
    const charCode = (event.which) ? event.which : event.keyCode;
    if (charCode == 101 || charCode == 69 || charCode == 45 || charCode == 43) {
      return false;
    }
    return true;

  }

Answer 8

Angular； IDE keyCode 弃用警告

功能上与 rinku 的答案相同，但具有 IDE 警告预防功能

numericOnly(event): boolean {
    // noinspection JSDeprecatedSymbols
    const charCode = (event.which) ? event.which : event.key || event.keyCode;  // keyCode is deprecated but needed for some browsers
    return !(charCode === 101 || charCode === 69 || charCode === 45 || charCode === 43);
}

Answer 9

排除除整数以外的所有内容的简单解决方案

<input  
    type="number"
    min="1" 
    step="1"
    onkeypress="return event.keyCode === 8 || event.charCode >= 48 && event.charCode <= 57">

此解决方案不阻止复制和粘贴（包括字母'e'）。

Answer 10

E代表指数，用于缩短长数。由于输入是数学输入，指数在数学中用来缩短大数，所以这就是为什么有 E.

显示是这样的：4e.

链接：1 and 2

Answer 11

简单而标准的解决方案：在Angular/Js/Ts中你可以使用正则表达式来限制任何输入键。

HTML: <input type="text" name="input1" (keypress)="numericOnly($event)" />

TS:

    numericPattern = /^[0-9]*$/;
    numericOnly(event){
       return this.numericPattern.test(event.key);
    }

Answer 12

以上解决方案仅适用于常规 html。对于 reactJS，我建议你改为这样做

  <input type="number" onKeyDown={(e) =>["e", "E", "+", "-"].includes(e.key) && e.preventDefault()} >

Answer 13

如果您按下一个键，而它的计算机语言等效值是 69，则不会键入它

<input
 type="number"
 onkeydown="return event.keyCode !== 69"
/>

为什么类型为 "number" 的 html 输入允许在字段中输入字母 'e'？

Why does the html input with type "number" allow the letter 'e' to be entered in the field?

html

numbers

input

这避免了 'e'、'-'、'+'、'.' ...所有不是数字的字符！

Angular； IDE keyCode 弃用警告