javascript - jQuery/Javascript - 多重 RegEx 验证

Question

您将如何在 jQuery 或 JS 中验证 2 个不同的正则表达式？

我的 JS 代码:

function validate(){
    var MyField = document.getElementById('MyField');
    if (MyField.value == null || !MyField.value.toString().match(/^(\d{3})-?\d{2}-?\d{4}$/) || !MyField.value.toString().match(/^(\d{2})-?\d{7}$/));
    alert('Ivalid Entry ...'); 
    return false;
}

我的 HTML:

<form action="">
  <input id="MyFIeld" name="MyField" type="text" />
  <input type="submit" value="Submit" onClick="validate();" />
</form>

基本上它的税号和 SSN 格式正确。 ＃＃-＃＃＃＃＃＃＃ 或者 ＃＃＃-＃＃-＃＃＃＃ ...我对 JS 或 jQuery 解决方案持开放态度...非常感谢所有帮助。

Answer 1

在这种情况下我通常做的是有一个正则表达式测试的“库”:

var regexTest = function() {
   this.TaxId = /^(\d{2})-?\d{7}$/;
   this.SSN = /^(\d{3})-?\d{2}-?\d{4}$/;
}

这会分隔您的正则表达式，以防由于某种原因需要更改它。相信我，它会不时发生。 (也许不是 SSN/TaxId，但这是一种很好的做法)

然后我设置一个类似于您所拥有的事件 block (jQuery 使其变得简单)以提供即时反馈:

$("#MyField").bind("blur keyup",
   function() {
      var myVal = $(this).val(); // should store $(this) in a var instead
      if(regexTest.SSN.test(myVal) || regexTest.TaxId.test(myVal)) {
         $(this).css("background-color", "");
      } else {
         $(this).css("background-color", "#FF0000");
      }
   }
);

我知道这不会在提交时验证，但它会在用户键入时向他们提供反馈。 (只要您保持验证简单，这在开销上也不是很糟糕。)然后执行数据服务器端的验证(人们可以绕过验证检查)，您应该很好。是的，它不会在提交前验证数据，但如果用户看到一个红色框，他们就知道这是错误数据。

当然，正如一些评论中所指出的那样，那里有验证库，但有时我喜欢编写自己的验证库。 ;)