Javascript/Jquery:使用数字范围验证输入

Javascript/Jquery: validate input with a number range

本文关键字:数字 范围 验证 输入 Jquery Javascript      更新时间:2023-09-26

我想验证预先配置的数字范围内的输入字段。只允许 1 到 24 之间的数字。

我该怎么办?


使用如下自定义解决方案:

    $('.field').keypress(function(event) {
        var val = parseInt($(this).val()) + HERE_I_SHOULD_SUM_THE_NEWLY_ADDED_DIGIT;
        if(val < 1 || val > 24) event.preventDefault();
    });

我能够检索当前输入值。如何添加新添加的数字?

这样的事情怎么样?

​$("input").on("change", function() {
    var val = Math.abs(parseInt(this.value, 10) || 1);
    this.value = val > 25 ? 24 : val;
});​​​​​​​​​​​​​

演示:http://jsfiddle.net/3jw4S/

现代浏览器中的输入有内置功能:

全面的概述可以在这里找到:http://www.the-art-of-web.com/html/html5-form-validation/

基本上,你可以写:

<input type="number" min="1" max="24" step="1" required>

使用模式,您可以定义要测试的正则表达式:

pattern="'d[0-3]"

JQuery 有一个插件可以帮助您进行验证,名为 Valid8:

http://unwrongest.com/projects/valid8/

您将需要使用正则表达式,例如:

^([1-9]|[1]?[1-9]?|[2][0-4]|10)$
function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x <1|| x >24)
  {
  alert("Value must be between 1 & 24");
  return false;
  }
}

类似的东西应该可以工作

试试这个

function validate() {
 var x = parseInt(value,10) // its the value from the input box;
 if(isNaN(x)||x<1||x>24)
 {
  alert("Value must be between 1 and 24");
  return false;
  }
}