如何使用 JQuery 正确检查值是否为数字？

Question

到一个 JQuery 脚本中我做这样的事情来检查插入到具有 id="variazioneAnticipo 的输入字段中的值是否是一个数字：

var variazioneAnticipo = $("#variazioneAnticipo").val();

if($.isNumeric(variazioneAnticipo)) {
    alert("NUMBER");
}
else {
     alert("NOT A NUMBER");
}

这很好用，但唯一的问题是 isNumeric() JQuery 函数也将数字视为 指数符号 和其他我不想被视为数字的符号。

这里怎么能看到：https://api.jquery.com/jQuery.isNumeric/这些符号算数：

$.isNumeric( 0xFF );      // true
$.isNumeric( "0xFF" );    // true
$.isNumeric( "8e5" );     // true (exponential notation string)

如何防止这些符号被视为数字？我能否以某种方式指定对我来说什么是数字，什么不使用 isNumeric() 函数？

或者如果一个值是数字而不考虑前面的情况，我该怎么说？

Answer 1

扩展 Tushar's ，将其作为答案 fiddle 检查：

$(function () {
  $("#out").click(function () {
    alert(/^[0-9]+(?:\.[0-9]+)?$/.test($("#in").val()) ? "Yes" : "No");
  });
});

<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<input type="text" id="in" />
<input type="submit" value="Check" id="out" />

非常适合数字、浮点值，而不是十六进制或指数。

Answer 2

在 input

pattern

在输入上绑定 keyup 事件
输入值时，检查该值是否满足浮点正则表达式

$('#num').on('keyup', function() {
  var value = $(this).val();

  if (/^[0-9]+(\.[0-9]+)?$/.test(value)) {
    $('#message').text('Valid');
  } else {
    $('#message').text('Invalid');
  }
});

#num:invalid {
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" pattern="[0-9]+(\.[0-9]+)?" id="num" />
<div id="message"></div>

Regex Explanation:

/^[0-9]+(\.[0-9]+)?$/

^：行首
[0-9]+：匹配一个或多个从 0 到 9 的数字
(\.[0-9]+)?：匹配一个或多个后跟小数点的数字。整个组可以出现零次或一次。
$: 行尾

相同的代码，只有 HTML 和 CSS

#valid,
#invalid {
  display: none;
}
#num:invalid,
#invalid {
  color: red;
}
#num:valid,
#valid {
  color: green;
}
#num:invalid ~ #invalid {
  display: block;
}
#num:valid + #valid {
  display: block;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" pattern="[0-9]+(\.[0-9]+)?" id="num" />
<div id="valid">Valid</div>
<div id="invalid">Invalid</div>

如何使用 JQuery 正确检查值是否为数字？

How can I correctly check if a value is a number using JQuery?

html

javascript

jquery

jquery-plugins