Jquery.validate 使用_1_入门使用

       一直没有时间写博文,但是发现自己以前用的很多技术,后面没有整理再次使用时,又要翻别人的文档、书,很不爽。

直接说说Jquery.validate 的使用步骤吧:

1. 到以下链接下载使用js文件。
下载资源
jquery官网:http://bassistance.de/jquery-plugins/jquery-plugin-validation
官网文档地址:http://docs.jquery.com/Plugins/Validation

2.创建一个最简单的HTML网页。

testvalidate.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /><title>jQuery validation plug-in - main demo</title><mce:script src="jquery.js" mce_src="jquery.js" type="text/javascript"></mce:script><mce:script src="jquery.validate.js" mce_src="jquery.validate.js" type="text/javascript"></mce:script><mce:script type="text/javascript"><!--$.validator.setDefaults({submitHandler: function() { alert("submitted!"); }});$().ready(function() {// validate signup form on keyup and submit$("#signupForm").validate({rules: {username: {required: true,minlength: 4},password: {required: true,minlength: 5},confirm_password: {required: true,minlength: 5,equalTo: "#password"},email: {required: true,email: true}},messages: {username: {required: "请输入用户名",minlength: "用户名长度至少为4位"},password: {required: "请输入密码",minlength: "密码长度至少应为5位"},confirm_password: {required: "请确认密码",minlength: "密码长度至少应为5位",equalTo: "两次密码输入不一致"},email: "请输入一个有效的电子邮箱地址"}});});// --></mce:script></head><body><form id="signupForm" method="get" action=""><input id="username" name="username" /><br><input id="password" name="password" type="password" /><br><input id="confirm_password" name="confirm_password" type="password" /><br><input id="email" name="email" /><br><input class="submit" type="submit" value="Submit"/></form></body></html>

3.将下载到目录解压找到jquery.js 和 jquery.validate.js ,并将它们与 testvalidate.html 放在同一目录下(主要是为了然大家看到最简单的调用关系)。

4.用浏览器打开 testvalidate.html 文件,点击提交按钮就可以看到效果。有心的朋友应该会修改吧!

本文的目标完成。我会在下一篇文章中,来编写本次 html文件的内容。

重要补充:如果被验证的域 name属性类似 obj.property ,在验证时这样写 “obj.property” 就好了

你可能感兴趣的:(html,function,XHTML,validation,文档,email)