<html>
<head>
<meta charset="utf8"></meta>
</head>
<body>
<script src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<script type="text/javascript">
$().ready(function() {
//$("#signupForm").validate();//不推荐
//此种方式需要将验证规则写在html中 且如果使用 class="{required:true,minlength:5,messages:{required:'请输入内容'}}"
//这样的方式话 还需再添加一个jquery.metadata.js 包 //方式2 将提示信息写入js中
//在验证没有通过之前 插件会自动禁止提交
$("#signupForm").validate({
rules: {
firstname: {
required:true,
remote:{
url:"check-name.php",
type:"get",
data:{
firstname:function(){
return $('input[name="firstname"]').val();
}
},
dataType:"json"
}
},
email: {
required: true,
email: true
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: "#password"
} },
messages: {
firstname: {
required:"请输入姓名",
remote:"换一个"
},
email: {
required: "请输入Email地址",
email: "请输入正确的email地址"
},
password: {
required: "请输入密码",
minlength: jQuery.format("密码不能小于{0}个字 符")
},
confirm_password: {
required: "请输入确认密码",
minlength: "确认密码不能小于5个字符",
equalTo: "两次输入密码不一致不一致"
}
}
});
});
</script> <form id="signupForm" method="get" action="coco.php">
<p>
<label for="firstname">Firstname</label>
<input id="firstname" name="firstname" class="required" />
</p>
<p>
<label for="email">E-Mail</label>
<input id="email" name="email" class="required email" />
</p>
<p>
<label for="password">Password</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="confirm_password">确认密码</label>
<input id="confirm_password" name="confirm_password" type="password" />
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</form>
</body> </html>
check-name.php
<?php
$name=$_REQUEST['firstname'];
$valid="";
if($name=="first"){
$valid="false";
}else if($name=="aaa"){
$valid="false";
}else{
$valid="true";
}
echo $valid;
?>