jQuery Mobile彈出窗、彈出層知識匯總
640
2024-03-15
小編上網(wǎng)查閱了許多關于jquery.validate的文章，大部門只是介紹它的api和用法，沒有一個詳細的的入門案例介紹，研究了半天還是無從下手。為此，小編自己做了一個jquery validate.js表單驗證入門實例，寫的不是特別好，但應該適用于初學者，分享給大家。
以下是validate.js表單驗證入門實例參考源碼，文章下面有源碼下載地址：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>j2query.validate快速入門范例-代瀟瑞博客</title>
<meta name="keywords" content="" />
<meta name="description" content="jquery.validate.js是一個強大的表單驗證插件，這里將來個快速入門范例，展示它的快速易用性。" />
<script src="http://www.gimoo.net/t/1904/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="http://www.gimoo.net/t/1904/jquery.validate.min.js" type="text/javascript"></script>
<style type="text/css">
label.error{color:red;font-size:13px;}
</style>
</head>
<body>
<p>信息錄入</p>
<form action="" name="infos" id="infos">
<p>用戶名：<input type="text" name="username" /></p>
<p>工作號：<input type="text" name="nums" /></p>
<p>備 注：<input type="text" name="notes" /></p>
<p><input type="submit" name="sub" /></p>
</form>
<script type="text/javascript">
$(function(){
$('#infos').validate({
debug:false, //false表示驗證通過后不要自動提交表單
onkeyup:false, //表示關閉按鍵松開時候監(jiān)聽驗證
rules:{ //驗證規(guī)則
username:{
required:true, //必填字段
rangelength:[6,10] //長度在6-10之間
},
nums:{
required:true,
digits:true
},
notes:"required"
},
messages:{ //自定義錯誤信息，默認為英文，除了在這里配置以為，還可以通過配置文件進行配置
username:{
required:"用戶名必填",
rangelength:"用戶名長度必須為6-10位"
},
nums:{
required:"工作號必填",
digits:"工作號必須為數(shù)字"
},
notes:"備注必填"
},
//驗證通過可以在這里做你想做的事情
submitHandler:function(form){
alert("驗證通過");
}
});
});
</script>
</body>
</html>
源碼下載：jquery validate.js表單驗證入門實例
演示地址：jquery validate.js表單驗證入門實例
以上就是為大家提供的一個簡單的jquery validate.js表單驗證入門實例，歡迎大家共同學習，希望對大家的學習有所幫助。
