虚拟键盘的键字符代码

Question

我有下面的代码允许用户只输入数字，这在浏览器中有效。但是当我在移动设备上访问时，我认为我无法获得正确的密钥代码。那么相同的键码是什么。与网络不同。

  // block e char, dot, hiphen and spacebar
  if (event.key === 'e' || [46, 45, 32].includes(event.charCode)) {
    event.preventDefault();
  }else{
   // allow to input logic
}

点、连字符和 space 的 charCode 是什么，它们适用于 Web 和移动键盘？

Answer 1

您的代码正在使用 event.charCode，它不存在。

event.which.charCode 确实如此。另外你不告诉我们是什么事件。有keypress, keydown, keyup, input还有一些没有设置一些预期的事件值

Tested on Android and iOS using browserstack

只有一个似乎可以在 Android

上的 React 中运行

export default function App() {
  const handleInput = (event) => {
    // eslint-disable-next-line
    event.target.value = event.target.value.replace(/[e\.\- ]/g, "");
    console.log(event.target.value);
  };

  return (
    <div className="App">
      <input type="number" onInput={handleInput} />
    </div>
  );
}

较早的答案

Keydown和推荐代号

document.getElementById("positiveIntOnly").addEventListener("keydown",function(e) {
  // block e char, dot, hyphen and spacebar
  if (["KeyE", "Period", "Minus", "Space"].includes(e.code)) {
    event.preventDefault();
    console.log(e.code);
  }
});

<input type="number" id="positiveIntOnly" />

或者如 TJ 所述，e.key:

document.getElementById("positiveIntOnly").addEventListener("keydown",function(e) {
  // block e char, dot, hyphen and spacebar
  if ("e.- ".includes(e.key)) {
    event.preventDefault();
    console.log(e.key);
  }
});

<input type="number" id="positiveIntOnly" />

设置最小值和最大值并使用正则表达式处理粘贴

<input type="number" id="positiveIntOnly" min="0" max="999" step="1" 
oninput="this.value = this.value.replace(/[e\.\- ]/g,'')" />

Answer 2

你可以 key 属性:

["e" ,"E", "-", ".", " "].includes(e.key)

You're not supposed to use the charCode property as it is deprecated.

虚拟键盘的键字符代码

key charCode for virtual keyboard

javascript

mobile

较早的答案