jQuery验证插件:添加自定义验证器只接受字母?

时间:2010-11-06 21:56:26

标签: jquery plugins validation

这是一段时间提出的问题:jQuery validate plugin : accept letters only?

我正在使用http://bassistance.de/jquery-plugins/jquery-plugin-validation/

中的验证插件

我想找到的是一种方法,让我的一些表格字段只接受字母,没有数字,特殊字符等...

回答的问题是:

“只需​​添加自定义验证器,并按照以下方式使用它:”

jQuery.validator.addMethod("accept", function(value, element, param) { return value.match(new RegExp("^" + param + "$")); });

    rules: { 
  field: { accept: "[a-zA-Z]+" } 
} 

但是,我似乎无法应用解决方案。

以下是我的代码,请告诉我如何进行更改。

<SCRIPT TYPE="text/javascript">
$.validator.setDefaults({
    submitHandler: function(form) { form.submit();  }
});

$().ready(function() {

    // validate signup form on keyup and submit
    $("#signUp").validate({
        rules: {
            fname: {
                required: true,
                minlength: 2
                },  
            lname: "required",
         user1: {
                required: true,
                minlength: 4

            },
            captcha: {

                required: true,
                minlength: 2
            },
            confirm_captcha: {
                required: true,
                equalTo: "#captcha"
            },
            email: {
                required: true,
                email: true
            },
            confirm_email: {
                required: true,
                equalTo: "#email"
            },
            topic: {
                required: "#newsletter:checked",
                minlength: 2
            },
            agree: "required"
        },
        messages: {
            fname: {
                required: " Please enter your first name",
                minlength: " Your name must consist of at least 3 characters"
            },
            lname: " Please enter your last name",
            user1: {
                required: " Please enter a username",
                minlength: " Username must consist of at least 4 characters"
            },

            confirm_captcha: {
                required: " Anti-SPAM required",
                equalTo: " Please solve the anti-SPAM equation correctly"
            },
            confirm_email: {
                required: " Please confirm your email",
                equalTo: " Please enter the same email as above"
            },
            email: " Please enter a valid email address",

            agree: " Please accept our policy"
        }
    });

    // propose username by combining first- and lastname
    $("#user1").focus(function() {
        var fname = $("#fname").val();
        var lname = $("#lname").val();
        if(fname && lname && !this.value) {
            this.value = fname + "." + lname;
        }
    });

    // check if confirm email is still valid after password changed
    $("#email").blur(function() {
        $("#confirm_email").valid();
    });

    // check if confirm captcha is still valid after password changed
    $("#captcha").blur(function() {
        $("#confirm_captcha").valid();
    });

    //code to hide topic selection, disable for demo
    var newsletter = $("#newsletter");
    // newsletter topics are optional, hide at first
    var inital = newsletter.is(":checked");
    var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
    var topicInputs = topics.find("input").attr("disabled", !inital);
    // show when newsletter is checked
    newsletter.click(function() {
        topics[this.checked ? "removeClass" : "addClass"]("gray");
        topicInputs.attr("disabled", !this.checked);
    });
});
</SCRIPT>

1 个答案:

答案 0 :(得分:3)

以下假设您只希望fname为字母。

搜索ALPHA_REGEX以查看我在代码中添加部件的位置。

此外,lname: "required",行是拼写错误吗?我真的不知道它是否需要lname: {"required":true},

<SCRIPT TYPE="text/javascript">

$.validator.setDefaults({ submitHandler: function(form) { form.submit(); } });

jQuery.validator.addMethod("regex", function(value, element, param) { return value.match(new RegExp("^" + param + "$")); });
var ALPHA_REGEX = "[a-zA-Z]*";

$().ready(function() {
    // validate signup form on keyup and submit
    $("#signUp").validate({
        rules: {
            fname: {
                regex: ALPHA_REGEX,
                required: true,
                minlength: 2
                },  
            lname: "required",
            user1: {
                required: true,
                minlength: 4

            },
            captcha: {

                required: true,
                minlength: 2
            },
            confirm_captcha: {
                required: true,
                equalTo: "#captcha"
            },
            email: {
                required: true,
                email: true
            },
            confirm_email: {
                required: true,
                equalTo: "#email"
            },
            topic: {
                required: "#newsletter:checked",
                minlength: 2
            },
            agree: "required"
        },
        messages: {
            fname: {
                required: " Please enter your first name",
                minlength: " Your name must consist of at least 3 characters"
            },
            lname: " Please enter your last name",
            user1: {
                required: " Please enter a username",
                minlength: " Username must consist of at least 4 characters"
            },

            confirm_captcha: {
                required: " Anti-SPAM required",
                equalTo: " Please solve the anti-SPAM equation correctly"
            },
            confirm_email: {
                required: " Please confirm your email",
                equalTo: " Please enter the same email as above"
            },
            email: " Please enter a valid email address",

            agree: " Please accept our policy"
        }
    });

    // propose username by combining first- and lastname
    $("#user1").focus(function() {
        var fname = $("#fname").val();
        var lname = $("#lname").val();
        if(fname && lname && !this.value) {
            this.value = fname + "." + lname;
        }
    });

    // check if confirm email is still valid after password changed
    $("#email").blur(function() {
        $("#confirm_email").valid();
    });

    // check if confirm captcha is still valid after password changed
    $("#captcha").blur(function() {
        $("#confirm_captcha").valid();
    });

    //code to hide topic selection, disable for demo
    var newsletter = $("#newsletter");
    // newsletter topics are optional, hide at first
    var inital = newsletter.is(":checked");
    var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray");
    var topicInputs = topics.find("input").attr("disabled", !inital);
    // show when newsletter is checked
    newsletter.click(function() {
        topics[this.checked ? "removeClass" : "addClass"]("gray");
        topicInputs.attr("disabled", !this.checked);
    });
});