javascript - 验证文本框中的双重类型

Question

检查是否在文本框中输入了有效的双精度类型编号“##.##”的最佳方法是什么？所以如果有一个小数输入一次，不要让用户再次输入。

正则表达式会是最好的方法吗？

任何帮助深表感谢

Answer 1

你可以像这样使用正则表达式

> "222.22".match(/^\d+.?\d*$/)
["222.22"]

> "222.22.2".match(/^\d+.?\d*$/)
null

您也可以尝试将其转换为数字，例如

> isNaN(Number("22.2.2"))
true

通过转换为数字进行检查的唯一问题或优势是它将允许像 1e6 这样的数字

> isNaN(Number("1e6"))
false

Answer 2

如果您在谈论 jQuery，那么有很多选择。其中大多数涉及正则表达式检查。

使用正则表达式匹配有效数字很容易，如果您主要关心的是防止进一步的字符插入，请继续阅读。

您需要做的就是以下内容。

1. 您需要一个整数字符映射来“允许”输入。
2. 阻止除与字符映射匹配的键之外的所有其他输入。
3. 如果已经有一个，则进一步防止“点”插入。

我假设您允许以点开头的模式，只要 javascript 将它解析为好像有一个前导零，并且许多开发人员将此视为速记。

同样使用 jQuery 标签，假设您正在使用 jQuery。

$("#Foo").keydown(function(e) {
    var c = e.keyCode
      , value = $(this).val();

    // Prevent insertion if the inserting character is
    // 1. a 'dot' but there is already one in the text box, or
    // 2. not numerics.
    if ( (c == 190 && value.indexOf('.') > -1) || c < 48 || c > 57 ) {
        e.preventDefault();
        return;
    }
});

Answer 3

如果使用 HTML5 是一种选择，您可以使用一种称为“模式”的新输入类型。

它是这样工作的：

<input id="numberField" type="text" title="You need to provide a number in the form of 2 integer and 2 decimal digits" pattern="\d{2}\.\d{2}" />

然后，您可以注册一个事件以使元素在失去焦点时不可编辑，如下所示（使用 jQuery）：

$("#numberField").blur(function() { $(this).attr("disabled", "disabled"); });

或者，如果您只想检查该字段包含的内容是否是数字（任何形式），您可以像这样检查它：

$("#numberField").blur(function() {
    if (!isNaN(parseInt($(this).val()))) {
        $(this).attr("disabled", "disabled");
    };
}​);​

在 fiddle 上检查一下。