只允许输入数字答案

【问题标题】：allow digits only for inputs只允许输入数字
【发布时间】：2009-04-07 05:22:03
【问题描述】：

我正在尝试实现一个 javacript 函数，该函数不允许用户输入除浮点数（数字）以外的任何内容

这是我的方法，但我不知道如何改进它以允许提交负数（允许“-”键）并在 IE 上工作。

function digits_only(evt, form) {
    var evt = evt || window.event,
        targ = evt.target || evt.srcElement,
        charCode = evt.which || evt.keyCode,
        keyChar = String.fromCharCode(charCode),
        isValid = true;
    if (charCode > 13) {
        isValid = /[0-9.]/.test(keyChar);
        //if a dolt is already in input
        if (keyChar === '.' && /\./.test(targ.value)) {
            isValid = false;
        }
    }
    return isValid;
}

【问题讨论】：

嗨，这是一个好方法吗？如果用户将一些文本复制或拖动到输入框中会发生什么。我认为您最好对提交事件进行验证。
是的，也应该添加验证，但他现在要求的是限制输入
但您无法确定用户输入的方式。他可以输入、粘贴甚至拖动一些文本。
+1。不要干扰用户的输入，这很烦人，并且没有涵盖更改字段的所有可能方式。
客户端更便宜...我也会在提交时进行验证

标签： javascript parsing

【解决方案1】：

我认为您正在寻找所谓的“输入掩码”。它们比只允许数字更强大。但是你可以直接使用它们。谷歌“javascript输入掩码”或查看this jQuery Plugin。

编辑：似乎链接的插件只支持固定长度的掩码，但该术语可能是一个很好的起点......

【讨论】：

【解决方案2】：

这是在 ASP.NET Web 应用程序上吗？您可以使用 AjaxControlToolkits MaskEditExtender。

【讨论】：

【解决方案3】：

我在这里问过类似的问题：
restrict user input using javascript

但是没有人给出这个问题的确切答案，所以让我们等到 WebForms 2.0 发布

【讨论】：

【解决方案4】：

您可以订阅“InputEvent”，然后获取“data”道具。例如

input.addEventListener('beforeinput', (event) => {
    const data = event.data;

    // if "data" is present - user enter some character
    // if "data" is NOT present - user tap non character key (e.g. delete, shift and other)
    if(data) {
        // check if data is number or "."
        const isAllow = /\d|\./.test(data);

        if(!isAllow) {
            e.preventDefault();
        }
    }
})

更多信息

event.data - https://developer.mozilla.org/en-US/docs/Web/API/InputEvent/data
输入前事件 - https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforeinput_event

【讨论】：