jQuery验证：如何为正则表达式验证添加规则？

我正在使用验证插件。好东西！我想将现有的ASP.NET解决方案迁移到使用jQuery而不是ASP.NET验证程序。我缺少正则表达式验证器的替换项。我希望能够做到以下几点：

$("Textbox").rules("add", { regularExpression: "^[a-zA-Z'.\s]{1,40}$" })

$.validator.addMethod(
    "regex",
    function(value, element, regexp) {
        return this.optional(element) || regexp.test(value);
    },
    "Please check your input."
);


$(function () {
    $('#uiEmailAdress').focus();
    $('#NewsletterForm').validate({
        rules: {
            uiEmailAdress:{
                required: true,
                email: true,
                minlength: 5
            },
            uiConfirmEmailAdress:{
                required: true,
                email: true,
                equalTo: '#uiEmailAdress'
            },
            DDLanguage:{
                required: true
            },
            Testveld:{
                required: true,
                regex: /^[0-9]{3}$/
            }
        },
        messages: {
            uiEmailAdress:{
                required: 'Verplicht veld',
                email: 'Ongeldig emailadres',
                minlength: 'Minimum 5 charaters vereist'
            },
            uiConfirmEmailAdress:{
                required: 'Verplicht veld',
                email: 'Ongeldig emailadres',
                equalTo: 'Veld is niet gelijk aan E-mailadres'
            },
            DDLanguage:{
                required: 'Verplicht veld'
            },
            Testveld:{
                required: 'Verplicht veld',
                regex: '_REGEX'
            }
        }
    });
});

如何添加自定义规则以实现此目的？

您可以使用addMethod（）

e、 g

---

这里有一篇好文章

感谢redsquare的回答，我添加了如下方法：

$("Textbox").rules("add", { regularExpression: "^[a-zA-Z'.\s]{1,40}$" })

$.validator.addMethod(
    "regex",
    function(value, element, regexp) {
        return this.optional(element) || regexp.test(value);
    },
    "Please check your input."
);


$(function () {
    $('#uiEmailAdress').focus();
    $('#NewsletterForm').validate({
        rules: {
            uiEmailAdress:{
                required: true,
                email: true,
                minlength: 5
            },
            uiConfirmEmailAdress:{
                required: true,
                email: true,
                equalTo: '#uiEmailAdress'
            },
            DDLanguage:{
                required: true
            },
            Testveld:{
                required: true,
                regex: /^[0-9]{3}$/
            }
        },
        messages: {
            uiEmailAdress:{
                required: 'Verplicht veld',
                email: 'Ongeldig emailadres',
                minlength: 'Minimum 5 charaters vereist'
            },
            uiConfirmEmailAdress:{
                required: 'Verplicht veld',
                email: 'Ongeldig emailadres',
                equalTo: 'Veld is niet gelijk aan E-mailadres'
            },
            DDLanguage:{
                required: 'Verplicht veld'
            },
            Testveld:{
                required: 'Verplicht veld',
                regex: '_REGEX'
            }
        }
    });
});

$.validator.addMethod(
“正则表达式”，
函数（值、元素、regexp）{
var re=新的RegExp（RegExp）；
返回此.optional（element）| | re.test（value）；
},
“请检查您的输入。”
);

现在，要根据任何正则表达式进行验证，只需执行以下操作：

$（“#Textbox”）.rules（“添加“，{regex:”^[a-zA-Z.\\s]{1,40}$”）

此外，似乎还有一个名为

additional methods.js

的文件，其中包含方法“pattern”，当使用不带引号的方法创建时，它可以是

RegExp

---

编辑

模式

功能现在是执行此操作的首选方法，例如：

$（“#Textbox”）.rules（“添加”，“模式：”^[a-zA-Z.\\s]{1,40}$”}）

---

稍微扩展一下皮特·舒尼奇的答案：

$.validator.addMethod(
        "regex",
        function(value, element, regexp) {
            if (regexp.constructor != RegExp)
                regexp = new RegExp(regexp);
            else if (regexp.global)
                regexp.lastIndex = 0;
            return this.optional(element) || regexp.test(value);
        },
        "Please check your input."
);

这将允许您将regex对象传递给规则

$("Textbox").rules("add", { regex: /^[a-zA-Z'.\s]{1,40}$/ });

在

RegExp

对象上设置

g

-标志时，需要重置

lastIndex

属性。否则，即使主题字符串不同，它也会从最后一个与该正则表达式匹配的位置开始验证

我的一些其他想法是让您能够使用正则表达式数组，以及另一个否定正则表达式的规则：

$("password").rules("add", {
    regex: [
        /^[a-zA-Z'.\s]{8,40}$/,
        /^.*[a-z].*$/,
        /^.*[A-Z].*$/,
        /^.*[0-9].*$/
    ],
    '!regex': /password|123/
});

但是实施这些可能太多了。

如以下内容所述：

请注意：虽然添加一个regex方法来检查其参数和值的诱惑很大，但将这些正则表达式封装在它们自己的方法中要干净得多。如果您需要许多稍微不同的表达式，请尝试提取一个公共参数。正则表达式库：

---

因此，是的，您必须为每个正则表达式添加一个方法。开销很小，但它允许您为正则表达式指定一个名称（不可低估）、一条默认消息（方便）以及在不同位置重用它的能力，而无需反复复制正则表达式本身。

我在整理用于执行jQuery正则表达式验证程序的所有部分时遇到了一些困难，但是我让它工作了。。。下面是一个完整的工作示例。它使用“验证”插件，可以在

$（）.ready（函数（））{
$.validator.addMethod（“电子邮件”），函数（值，元素）{
返回此.optional（element）| |/^[a-zA-Z0-9.U-]+@[a-zA-Z0-9-]+\[a-zA-Z.]{2,5}$/i.test（值）；
}，“电子邮件地址无效：请输入有效的电子邮件地址。”）；
$.validator.addMethod（“密码”），函数（值，元素）{
返回此.optional（element）| |/^（？=.*\d）（？=.[a-z]）（？=.[a-z]）。{8,16}$/i.test（value）；
}，“密码为8-16个字符，包含大写字母、小写字母和至少一个数字。”）；
$.validator.addMethod（“提交”），函数（值，元素）{
返回此.optional（元素）| |/[^]/i.test（值）；
}，“您没有单击提交按钮。”）；
//在键盘上验证注册表格并提交
$（“#登录”）.validate({
规则：{
电子邮件：“必需的电子邮件”，
密码：“必需密码”，
提交：“必需提交”，
},
});
});
登录
电子邮件地址
密码

没有理由将正则表达式定义为字符串

$.validator.addMethod(
    "regex",
    function(value, element, regexp) {
        var check = false;
        return this.optional(element) || regexp.test(value);
    },
    "Please check your input."
);

及

---

这样更好，不是吗？

我让它这样工作：

$("Textbox").rules("add", { regularExpression: "^[a-zA-Z'.\s]{1,40}$" })

$.validator.addMethod(
    "regex",
    function(value, element, regexp) {
        return this.optional(element) || regexp.test(value);
    },
    "Please check your input."
);


$(function () {
    $('#uiEmailAdress').focus();
    $('#NewsletterForm').validate({
        rules: {
            uiEmailAdress:{
                required: true,
                email: true,
                minlength: 5
            },
            uiConfirmEmailAdress:{
                required: true,
                email: true,
                equalTo: '#uiEmailAdress'
            },
            DDLanguage:{
                required: true
            },
            Testveld:{
                required: true,
                regex: /^[0-9]{3}$/
            }
        },
        messages: {
            uiEmailAdress:{
                required: 'Verplicht veld',
                email: 'Ongeldig emailadres',
                minlength: 'Minimum 5 charaters vereist'
            },
            uiConfirmEmailAdress:{
                required: 'Verplicht veld',
                email: 'Ongeldig emailadres',
                equalTo: 'Veld is niet gelijk aan E-mailadres'
            },
            DDLanguage:{
                required: 'Verplicht veld'
            },
            Testveld:{
                required: 'Verplicht veld',
                regex: '_REGEX'
            }
        }
    });
});

---

确保正则表达式介于

/

：-）

我们主要使用jquery验证插件的标记符号，当正则表达式中存在标志时，发布的示例对我们不起作用，例如

<input type="text" name="myfield" regex="/^[0-9]{3}$/i" />

当然，现在可以将这段代码与上面的一段代码结合起来，允许将RegExp对象传递到插件中，但是由于我们不需要它，所以我们将此练习留给读者；-）

PS：也有捆绑插件，这是工作代码

function validateSignup()
{   
    $.validator.addMethod(
            "regex",
            function(value, element, regexp) 
            {
                if (regexp.constructor != RegExp)
                    regexp = new RegExp(regexp);
                else if (regexp.global)
                    regexp.lastIndex = 0;
                return this.optional(element) || regexp.test(value);
            },
            "Please check your input."
    );

    $('#signupForm').validate(
    {

        onkeyup : false,
        errorClass: "req_mess",
        ignore: ":hidden",
        validClass: "signup_valid_class",
        errorClass: "signup_error_class",

        rules:
        {

            email:
            {
                required: true,
                email: true,
                regex: /^[A-Za-z0-9_]+\@[A-Za-z0-9_]+\.[A-Za-z0-9_]+/,
            },

            userId:
            {
                required: true,
                minlength: 6,
                maxlength: 15,
                regex: /^[A-Za-z0-9_]{6,15}$/,
            },

            phoneNum:
            {
                required: true,
                regex: /^[+-]{1}[0-9]{1,3}\-[0-9]{10}$/,
            },

        },
        messages: 
        {
            email: 
            {
                required: 'You must enter a email',
                regex: 'Please enter a valid email without spacial chars, ie, Example@gmail.com'
            },

            userId:
            {
                required: 'Alphanumeric, _, min:6, max:15',
                regex: "Please enter any alphaNumeric char of length between 6-15, ie, sbp_arun_2016"
            },

            phoneNum: 
            {
                required: "Please enter your phone number",
                regex: "e.g. +91-1234567890"    
            },

        },

        submitHandler: function (form)
        {
            return true;
        }
    });
}

---

这对我来说很有效，是验证规则之一：

    Zip: {
                required: true,
                regex: /^\d{5}(?:[-\s]\d{4})?$/
            }

希望对您有所帮助

您可以使用

附加方法.js

文件中定义的

模式

。请注意，这个附加的-methods.js文件必须在jQuery验证依赖项之后包含，然后您就可以使用

$（“#frm”）。验证({
规则：{
文本框：{
模式：/^[a-zA-Z'.\s]{1,40}$/
},
},
信息：{
文本框：{
模式：“文本框字符串格式无效”
}
}
});


文本框

你试过这个吗

$("Textbox").rules("add", { regex: "^[a-zA-Z'.\\s]{1,40}$", messages: { regex: "The text is invalid..." } })

注意：请确保在正则表达式前面添加另一个“\”以避开所有的“\”，否则正则表达式将无法按预期工作。
不要真正回答问题。如果你想要一个通用的正则表达式规则呢？有了这个答案，您必须为每个不同的正则表达式添加方法。您的答案非常值得赞赏！谢谢我会再考虑的。在我们的案例中，正则表达式验证似乎是最合适的。但是，我理解您使用“命名”验证的目的…$（“Textbox”）应该是$（“#Textbox”）。我会让RegExp在方法之外定义为li
$("Textbox").rules("add", { regex: "^[a-zA-Z'.\\s]{1,40}$", messages: { regex: "The text is invalid..." } })