使用正则表达式验证jQuery中的输入

问题描述：

我有一个函数只接受来自文本框的整型输入。在调用它的parseInt方法后，它仍然接受字符串后面的整数。我想知道如何实现一个正则表达式来过滤掉包含字符串的输入。这是我的代码。使用正则表达式验证jQuery中的输入

var validate = function() { 
    $("#newgame").click(function() { 
     $("label").text("What's your guess."); 
     $("#guess").val(""); 
    }) 
    $("#submitguess").click(function() { 
     initguess = parseInt($("#guess").val(), 10); 
     if (isNaN(initguess) || initguess > 100 || initguess < 0 || typeof initguess === "string") { 

      $("label").text("Enter a valid format."); 

     } 

     else { 

      if (initguess === number) { 
       $("label").text("Waoh! You guessed right."); 
       $("#submitguess").hide("slow"); 
       // displaybar(diff); 
      } 
      else { 
       $("label").text("You are getting hot."); 
       // displaybar(diff); 
       feedback(initguess); 
      } 
     } 
     // var diff = (100 - Math.abs(number - initguess)); 
     // displaybar(diff); 
    }); 
}

为什么不能忽略输入字符串文字？例如，如果我按“a”它忽略它，但0-9是好的;） – Holybreath 2014-09-10 11:43:16

^[1-9] [0-9]？$ |^100 $ from http://stackoverflow.com/questions/ 13473523 /正则表达式之间的1和100 – 2014-09-10 11:48:09

答

贷@Holybreath，他指出了正确的方向。在#submitguess附带的'click'功能中，您犯了一个错误。

在第一行中，你对值做了一个parseInt（）。结果：字符串“77”被转换为号码 77. 之后在第二行中，您检查initguess是一个数字。当然，它是，你自己使它成为一个数字！

您可以简化您的代码如下：

var validate = function() { 
    $("#newgame").click(function() { 
     $("label").text("What's your guess."); 
     $("#guess").val(""); 
    }) 
    $("#submitguess").click(function() { 
     initguess = $("#guess").val(); // get the vaue 
     // check if initguess is not a number or not an integer between 0 and 100 
     if (typeof initguess !== 'number' || !(/^[1-9]\d?$/.test(initguess))) { 
      $("label").text("Enter a valid format."); // output the error-message 
      return; // return at this point prevents all following code from being executed 
     } // so you don't need the next 'else' statement anymore 

     if (initguess === number) { 
      $("label").text("Waoh! You guessed right."); 
      $("#submitguess").hide("slow"); 
      // displaybar(diff); 
     } 
     else { 
      $("label").text("You are getting hot."); 
      // displaybar(diff); 
      feedback(initguess); 
     } 
     // var diff = (100 - Math.abs(number - initguess)); 
     // displaybar(diff); 
    }); 
}

非常感谢它的工作...其他建议是有帮助的，但我需要实现一个正则表达式的条件，你杀了它。 – dejijaye 2014-09-10 13:42:58

答

考虑这个例子：http://jsbin.com/foyuve/1/

// text field 
var test = $.trim($('#test').val()); 

// check for only integer values 
if((/^[0-9]+[0-9]$/).test(test)) { 
    alert('int'); 
}

答

与以前的评论表示赞同。很容易勾住按键事件以防止首先输入非数字字符，并且您不一定需要正则表达式。例如功能：

function numericOnly(e) { 
    var ev = e ? e : window.event; 
    var code = ev.which || ev.keyCode; 
    if (ev.shiftKey) { 
     return false; 
    }   
    return ((code >= 48 && code <= 57) || code == 8 || code == 16 || code == 9 || code == 37 || code == 35 || code == 36); //also allow backspace, delete, tab, right and left arrows, home, end 
}

}

在你的输入，添加此属性：

onkeypress="return numericOnly(event)"

这也是验证服务器作为预防措施上输入一个好主意。

答

在您的输入字段需要数字只有你可以做这样的事情。

HTML

<input type="text" class="validateNumber">

jQuery的

$(".validateNumber").on('keydown keyup click blue change', function (e) { 
    // Allow: backspace, delete, tab, escape, enter, space and , 
    if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 188, 32]) !== -1 || 
     // Allow: Ctrl+A 
     (e.keyCode == 65 && e.ctrlKey === true) || 
     // Allow: home, end, left, right 
     (e.keyCode >= 35 && e.keyCode <= 39)) { 
      // let it happen, don't do anything 
      return; 
    } 
    // Ensure that it is a number and stop the keypress 
    if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) { 
     e.preventDefault(); 
    } 
});

使用正则表达式验证jQuery中的输入

相关推荐