您的位置:首页 > Web前端 > JQuery

JQuery validate ajax 表单验证方法。

2013-11-15 09:16 609 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="js/jquery-1.9.min.js"></script>
<script src="js/jquery.validate.js"></script>
<script src="js/jquery.validate.messages_cn.js"></script>
<script>
$(function(){
$("#form1").validate({
rules:{
username:{
required:true,
remote:{
url:"doAction.php",
type:"post",
dateType:"json",
data :{
username:function(){return $("#username").val();}
}
}
}
},
messages:{
username:{
require:"用户名不能为空", remote:"该用户名存在"
}
}
});
});

</script>
<style>
.table1 tr td{
border:1px solid yellow;
margin:0px;
padding:0px;
}

</style>
</head>
<body>
<div style="margin:0 auto; width:500px; height:200px; padding:0px">
<form id="form1" method="get">
<table border="0" cellspacing="0" cellpadding="0" class="table1" width="500px">
<tr height="30px">
<td align="right" width="80">用户名</td>
<td align="left"><input  type="text" id="username" name="username"/></td>
</tr>

<tr height="30px">
<td colspan="2" align="center">
<input type="submit" value="提交"/>
<input type="reset" value="重置"/>
</td>
</tr>

</table>
</form>
</div>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: