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

Question

这是一个问题，提出了一些时间回：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> 

Answer 1

下面假设您只想要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); 
    }); 
});