javascript - jquery 验证正则表达式方法与焦点上的 jquery 掩码冲突

Question

我有一个 asp.net mvc 模型，它在邮政编码和电话字段上使用 RegularExpressionAttribute，并在输入上使用 jquery.maskedinput(来自 Josh Bush 的 v1.4.1)。没有必需的属性。

• 邮政编码正则表达式:^\d{5}(-\d{4})?$
• 邮政编码掩码:99999？-9999
• 电话正则表达式:^(?(\d{3}))?[\s-]?\d{3}[\s-]?\d{4}$
• 电话号码:(999) 999-9999

我通过如下所示的调用将掩码应用于输入:

$form.find('.zip-mask').mask('99999?-9999');

表单验证工作正常。但是，如果我远离这些屏蔽正则表达式输入之一并将字段保留为空，jquery 验证将为输入提供亮红色轮廓，表示无效。我想防止这种情况发生。

我可以看到问题发生在哪里。我正在使用 jquery.validate 版本 1.16.0。在 jquery.validate.unobtrusive.js 第 342 行中，这行代码添加了正则表达式验证方法:

$jQval.addMethod("regex", function (value, element, params) {

此方法会在焦点事件和表单验证时触发。当它在聚焦时触发并且输入为空时，“value”参数包含邮政编码或电话掩码(即“_____？-____”或“(_) _-____”)。由于这个掩码显然不符合正则表达式，因此它返回 false，并且我在输入周围看到红色条。

当它触发表单验证并且输入为空时，“value”参数是一个空字符串，并且该方法返回 true，因此表单保存成功。

综上所述:表单验证有效，因为表单验证时“value”参数是空字符串，但焦点验证失败，因为在焦点焦点上“value”参数是掩码。

当输入为空并且发生焦点正则表达式验证时，是否有任何方法可以阻止输入在“value”参数中传递掩码？

Answer 1

根据 Stephen Muecke 的建议，答案是简单地将 OR 条件附加到每个正则表达式的末尾，因此两个正则表达式现在看起来像这样:

• 邮政编码正则表达式:^\d{5}(-\d{4})?$|^\d{5}-____|_____-____
• 电话正则表达式:^(?(\d{3}))?[\s-]?\d{3}[\s-]?\d{4}$|(___) ___-____<

邮政编码正则表达式需要两个 OR 条件，因为邮政编码可以是 5 或 9 位数字。第一个 OR 处理 5 位 zip 和部分掩码，另一个处理空输入，即整个掩码。