标签:
JQuery.validate.js 在表单验证中经常使用,初学,对于其中Remote的使用说明一下.
1. 基本解释
JQuery主要用于DOM树和CSS树的检索和后面的操作的一套方法,JQuery.validate.js是对JQuery的一个插件,可以认为是对JQuery在某个特殊场景下的扩展,而Validate就是对表单验证提供的扩展。
2. 场景解释
用户进行注册用户的时候,要异步的判断用户名是否存在,给出提示信息。
3. 通过案例学习
Html和JavaScript结合的脚本.
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 4 <head> 5 <script src="../includes/libraries/javascript/jquery.js" type="text/javascript" charset="utf-8" ></script> 6 <script src="../includes/libraries/javascript/jquery.plugins/jquery.validate.js" type="text/javascript" charset="utf-8"></script> 7 8 <script type="text/javascript"> 9 $().ready(function() { 10 $("#signupForm").validate({ 11 12 debug: false, 13 onkeyup:false, 14 /*忽略某些元素不做验证*/ 15 //ignore: ".ignore", 16 17 /* 更改错误信息显示的位置 18 Default: 19 errorPlacement: function(error, element) { 20 error.appendTo(element.parent()); 21 } 22 error.appendTo(element.parent()); 23 */ 24 /* 25 submitHandle: function(form){ 26 alert("submited!"); 27 form.submit();}, 28 */ 29 rules: { 30 /* 31 firstname: { 32 required: function(){ return true;}}, 33 */ 34 35 firstname: { 36 required: true, 37 remote: { 38 url: "Learn.php", 39 type: "post", 40 //DataType: "json", 41 data: { 42 firstname: function(){ 43 return $("#firstname").val(); 44 } 45 }}}, 46 47 phonenum: { 48 required: true, 49 digits: true, 50 rangelength: [11,11]}, 51 52 email: { 53 required: true, 54 email: true}, 55 56 password: { 57 required: true, 58 minlength: 5}, 59 60 confirm_password: { 61 required: true, 62 minlength: 5, 63 equalTo: "#password"} 64 }, 65 66 messages: { 67 firstname: { 68 required: "请输入姓名", 69 remote: "请输入姓名,remote"}, 70 71 phonenum: { 72 required: "请输入手机号", 73 digits: "存在字符,非法手机号", 74 rangelength: "手机号位数不对"}, 75 76 email: { 77 required: "请输入Email地址", 78 email: "请输入正确的email地址"}, 79 80 password: { 81 required: "请输入密码", 82 minlength: jQuery.format("密码不能小于{0}个字 符")}, 83 84 confirm_password: { 85 required: "请输入确认密码", 86 minlength: "确认密码不能小于5个字符", 87 equalTo: "两次输入密码不一致不一致"} 88 }, 89 90 submitHandler: function(form){ 91 alert("验证通过");} 92 93 }); 94 }); 95 </script> 96 97 </head> 98 99 <body> 100 101 102 <form id="signupForm" method="post" action=""> 103 <p> 104 <label for="firstname">姓氏</label> 105 <input id="firstname" name="firstname" /> 106 </p> 107 108 <p> 109 <label for="phonenum">手机</label> 110 <input id="phonenum" name="phonenum" /> 111 </p> 112 113 <p> 114 <label for="email">邮件</label> 115 <input id="email" name="email" /> 116 </p> 117 118 <p> 119 <label for="password">密码</label> 120 <input id="password" name="password" type="password" /> 121 </p> 122 123 <p> 124 <label for="confirm_password">确认密码</label> 125 <input id="confirm_password" name="confirm_password" type="password" /> 126 </p> 127 128 <p> 129 <input class="submit" type="submit" value="提交"/> 130 </p> 131 132 </form> 133 </body> 134 </html>
后台PHP代码 BaseFunction.php
<?php function WriteLog($msg) { $filename = dirname(__FILE__) ."\\Debug.log"; $handler = null; if (($handler = fopen($filename, ‘ab+‘)) !== false) { fwrite($handler, "\n".‘[‘.date(‘Y-m-d H:i:s‘).‘]‘."\t".$msg); fclose($handler); } } function CheckUser($UserName) { if( $_REQUEST[$UserName] == ‘php‘ ){ exit("false"); } else{ exit("true"); } } ?>
后台PHP代码 Learn.php
<?php require("BaseFunction.php"); CheckUser(‘firstname‘); ?>
标签:
原文地址:http://www.cnblogs.com/wildfox/p/5491811.html