Javascript - Value.replace 包含 1 个字母

Question

我正在创建一个登录页面，我希望用户名只能输入数字，因此它将接受 1000，但如果我输入 1000t 并尝试提交表单，它应该拒绝它。

我尝试采用不同的方法，根本不允许用户输入字母，但当我使用我的代码时，由于某种原因，它允许我输入最多 1 个字符。 IE。我可以输入 1000t，但不能输入 1000ttt。如果我尝试输入 1000t 后跟一个“f”，它会将 t 替换为 f，所以我会得到 1000f。但我只想显示数字

我的脚本:

<script>
function validate(evt){
 evt.value = evt.value.replace(/[^0-9]/g,"");
    }
</script>

我的表格:

<form action="customer_login.jsp" method="POST">
  Customer Number: <input type="text" name="username" onkeypress="validate(username)" />
  <br />
  Password: <input type="text" name="password" />
  <br />
  <input type="submit" value="Login" />
</form>

编辑:我还注意到，如果我输入 1001a 并按 Tab 键，它会删除 a，但如果我单击密码框，它会保留 a

Answer 1

您可以使用<input type="number"> 。然而，这将包括负数、 float 和特殊数字( 10e4 等)。

如果您想要正则表达式，可以使用 this 将元素传递给 JavaScript 函数。 。然后，将元素的值替换为修改后的新值。出现您的问题，因为您使用了 onkeypress 。当您按下某个键时，会立即触发此事件。仅在松开按键后才会添加实际字母。所以，你需要使用onkeyup反而。这是一个片段:

function validate(element) {
  element.value = element.value.replace(/[^0-9]/g, '');
}

<form action="customer_login.jsp" method="POST">
  Customer Number: <input type="text" name="username" onkeyup="validate(this)" />
  <br />
  Password: <input type="text" name="password" />
  <br />
  <input type="submit" value="Login" />
</form>