javascript - 限制用户在 type=number 的输入字段中仅键入数字

Question

我正在建立一个网站，遇到了一个问题。

问题是，当用户被要求输入价格时，他们不仅可以输入数字，还可以输入他们想要的任何内容。我想限制用户仅在该输入字段中键入数字。我已经尝试过type=number属性pattern="[0-9]+"并给它一个样式appearence: textfield（因为它在浏览器中显示时显示向上箭头和向下箭头），但它似乎不起作用。我想有一个使用javascript的解决方案。

HTML：

<input class="input-price" type="number">

CSS：

input[type="number"] {
  appearance: textfield;
}

input[type="number"] {
  appearance: textfield;
}

<input class="input-price" type="number">

希望有人能给我一个解决方案。提前致谢！

标签： javascripthtmlcssinputnumbers

Answer 1

type="number"仅适用于兼容 HTML5 的浏览器。溢出中已经有一个可用的答案，用于在此处使用 Javascript 获得结果。