如何实现一个只支持整数的数字输入框？

Question

如何实现一个只支持整数的数字输入框？

linong

29.2k1266133

发布于
2024-02-11 北京

如何实现一个只支持整数的数字输入框，-.e 之类的不支出输入

本文参与了思否 HarmonyOS 技术问答马拉松，欢迎正在阅读的你也加入。

harmonyos

阅读 516

AI BotBETA

你可以通过在输入框的 input 事件上添加一个事件监听器来实现这个功能。当用户在输入框中输入内容时，你可以检查输入的内容是否为数字，如果不是，则将其删除。

以下是一个简单的示例代码：

<input type="text" id="myInput">

<script>
  document.getElementById('myInput').addEventListener('input', function(e) {
    // 获取输入框的当前值
    var value = e.target.value;
    // 创建一个新的字符串用于保存处理后的值
    var newValue = '';
    // 遍历每个字符
    for (var i = 0; i < value.length; i++) {
      // 如果字符是数字，则添加到新的字符串中
      if (/\d/.test(value[i])) {
        newValue += value[i];
      }
    }
    // 更新输入框的值
    e.target.value = newValue;
  });
</script>

这个示例代码中的正则表达式 /d 用于匹配任何数字。如果你想支持小数点，可以将其修改为 /[\d.]/。

1 个回答

得票最新

查拉图斯特拉说

3811116

发布于
2024-03-20 广东

你可以监听某个输入事件，然后判断输入内容，不是字符的不渲染到页面即可