logo标签列表

只允许输入数字的HTML表单。

html
4

如果你希望在HTML文本框中只能输入数字，需要怎样的代码呢？当你输入字母时，不应该有任何字母显示出来，只有当你输入数字时，才会显示成数字，请帮忙。

6个回答
3
如果您愿意冒险使用草案规范，可以使用“数字类型（number type）”：（点此阅读详情）。
<input name="foo" type="number">

（另请参见规范）
目前，浏览器对此的支持非常有限，但正在增加。您可能需要添加JavaScript来模拟在较不先进的浏览器中的支持。有各种项目可以做到这一点，包括jsh5f和webforms2。
显然，无论采取哪种方法解决问题，您仍需要对数据进行服务器端检查（您永远不能信任客户端，因为用户可以绕过您在那里施加的任何限制）。
2
1
尝试这个：
 <HTML>
       <HEAD>
       <SCRIPT type="text/javascript">

          function isNumberKey(evt)
          {
             var charCode = (evt.which) ? evt.which : event.keyCode
             if (charCode > 31 && (charCode < 48 || charCode > 57))
                return false;

             return true;
          }

       </SCRIPT>
       </HEAD>
       <BODY>
          <INPUT id="txtChar" onkeypress="return isNumberKey(event)" type="text" name="txtChar">
       </BODY>
    </HTML>
这无法处理粘贴的数据。 - Quentin
这并不意味着它没有缺陷。 - Quentin
0

text 属性适用于 HTML 表单。我建议您在服务器端使用正则表达式，以便它只返回一个数字。您可能能够在 JavaScript 中使用正则表达式，但这可能不像服务器端实现那样安全。

这是类型属性的一个值，而不是它自己的属性。正则表达式不应该是即时选择的方法——通常有更有效率和更易于阅读的方法来判断某物是否为数字。客户端方法永远不会完全安全地检查表单数据是否符合要求，但它确实使用户使用起来更加方便，因此应采取两种方法。 - Quentin
实际上，你需要两者兼备。客户端适合用户交互，并减少了在服务器指出错误后再次提交表单的问题。服务器端用于验证。 - Joey
0

我有一个一行代码：

<input type="number" onkeypress="return /[0-9]/i.test(event.key)">
0

为了只输入数字，您可以创建一个jQuery函数来验证您在输入文本框中键入的字符

您的HTML代码可能如下所示：

<input class="integerInput" type="text">

你的jQuery函数可能像这样：

$(function() {
    $('.integerInput').on('input', function() {
      this.value = this.value
        .replace(/[^\d]/g, ''); // numbers only

    });
});
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接