See http://docs.jquery.com/plugins/validationand sort out
Jquery. validate. JS is a verification framework of jquery. With the advantages of jquery, we can quickly verify some common input, expand our own verification methods, and provide good support for internationalization.
It's easy to use this function. See the following code:
HTML code<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">To sum up, we only need to add the following JavaScript code to add the specified form for verification.
HTML code
- $ (Document). Ready (function (){
- $ ("# Commentform"). Validate ();
- });
$(document).ready(function(){ $("#commentForm").validate(); });
However, we also need to add required to the class in the input to be verified. The other is to verify the relevant data. For example, email is the data structure of the verification email.The following lists the default verification items provided by validate.
Required: "required fields ",
Remote: "Please correct this field ",
Email:
"Enter an email in the correct format ",
URL: "enter a valid URL ",
Date: "enter a valid date ",
Dateiso: "enter a valid date (ISO ).",
Number: "enter a valid number ",
Digits: "Only integers can be entered ",
Creditcard: "enter a valid credit card number ",
Similar:
"Enter the same value again ",
Accept: "enter a string with a valid suffix ",
Maxlength:
Jquery. Format ("enter a string with a maximum length of {0 "),
Minlength:
Jquery. Format ("enter a string with at least {0} length "),
Rangelength:
Jquery. Format ("enter a string between {0} and {1 "),
Range:
Jquery. Format ("enter a value between {0} and {1 "),
MAX: jquery. Format ("Enter the maximum value
{0} value "),
Min: jquery. Format ("enter a minimum value of {0 ")Validate() Option Debug: debug mode
$(".selector").validate
({
debug: true
})Set debugging as default
$.validator.setDefaults
({
debug: true
})
Submithandler: use other methods to replace the default submit, such as Ajax-based submission.
$(".selector").validate
({
submitHandler: function(form) {
$(form).ajaxSubmit();
}
})
Ignore: Ignore some elements not verified
$("#myform").validate
({
ignore: ".ignore"
})
Rules: by default, according to the form classes, attributes,
Metadata judgment, but it can also be declared in the validate Function
Key/value can be customized rules. Key is the name of an object. value is the rule of an object and can be used in combination.
Class/attribute/metadata rules.The following code specifically verifies that name = 'name' In the selector class is required and email is both required and conforms to the email format
$(".selector").validate
({
rules: {
// simple rule, converted to {required:true}
name: "required",
// compound rule
email: {
required: true,
email: true
}
}
})
Messages: Change the default message.
$(".selector").validate
({
rules: {
name: "required",
email: {
required: true,
email: true
}
},
messages: {
name: "Please specify your name",
email: {
required: "We need your email address to contact you",
email: "Your email address must be in the format of name@domain.com"
}
}
})Groups: defines a group, puts the error information consent in several places in one place, and uses errorplacement to control where the error information is put
$("#myform").validate
({
groups: {
username: "fname lname"
},
errorPlacement: function(error, element) {
if (element.attr("name") == "fname" || element.attr("name") == "lname" )
error.insertAfter("#lastname");
else
error.insertAfter(element);
},
debug:true
})
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
