接上一篇
2）messages
提示：修改默認的提示信息最簡單的方法是引入message_zh.js文件即可！
如果需要在validate()方法內提示則可以使用本選項
類型：Object
說明：自定義的提示信息，key：value形式，key是要驗證的元素，valule可以是字符串或者函數
使用：message：{
username："請輸入你的用戶名"
filed2:{
required:'必須填寫這個字段'，
email:'請添加一個正確的郵箱格式'
}
}
//和上面填寫rules是一樣的
submitHandler
類型：Function(form)
說明：通過驗證后運行的函數，默認添加該函數則不會再提交除非手動提交或者使用return true,
函數類型：該函數接受一個參數表示當前DOM對象
invalidHandler
類型：Function(event,validator)
說明：當一個無效的表單(即驗證不通過的時候)被提交的時候觸發這個函數。
函數參數：當前驗證的表單validator對象
errorClass(默認值error)
類型:String
說明:指定錯誤提示與驗證不通過的控件的Css類名
6) validClass(默認值：'valid')
類型：String
說明：在驗證成功的控件上加上傳入的CSS類
7)errorElement(默認值：lable)
類型：String
說明：用什么標簽標記錯誤div或者span或者label
8)errorPlacement（默認值：在 無效的元素之后），
9) errorContainer
類型：選擇器字符串
說明：有錯誤信息出現時把選擇器匹配的元素變為顯示，無錯誤時隱藏
10) errorLableContainer
類型：選擇器字符串
說明：把錯誤信息統一放在一個容器里面
11) wrapper
類型：String
說明：用什么標簽再把上邊的errorElement包起來
11) success
類型：String or function（label，element）
說明：每個字段驗證通過執行函數
函數參數：
label：信息提示標簽的Jquery對象。
element:當前驗證成功的DOM元素對象
如果跟一個字符串會作為CSS類加在提示信息的標簽上
重點用於修改提示信息
12 highlight(默認值：添加errorClass到驗證失敗的表單控件)
類型：function(element,errorClass,validClass)
說明：傳入的函數會在每個控件驗證不通過時執行，我們可以通過這個配置屬性，給驗證不通過的加寫效果。
函數參數：
element：當前未通過驗證的Dom元素對象
errorClass: 錯誤時給錯誤提示標簽的css類名稱
validClass: validClass屬性的當前值
14）unhighlight(默認值：移除驗證失敗控件的errorClass)（參數同上）
重點：驗證通過的表單
15) debug(默認值false)
類型：boolean
設置為true之后則表單不會真正的提交，僅僅是驗證！
使用方法以及參數同上，作用相反
16）ignore（默認值：'hidden'）
類型：Selector
說明：忽略某些元素不驗證
15）16)在測試時用
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="../js/jquery-1.12.1.js"></script> <script type="text/javascript" src="../js/validation/jquery.validate.js"></script> <script type="text/javascript" src="../js/validation/messages_zh.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#form1").validate({ rules: { field1:{ required:true, rangelength:[4,6] } }, messages:{ field1:{ required:'field1不能為空', rangelength:'field1的長度必須子{0}與{1}之間' /*{0}取的是上述屬性的第一個值，{1}取的是上述屬性的第二個值 */ } }, submitHandler:function(form){ console.log('success'); }, invalidHandler:function(event,validator) { console.log("faile"); }, errorClass:'sunshengli', validClass:'sifangku', errorElement:'label', errorPlacement:function($error,element) { $error.insertBefore(element); }, errorContainer:'#info', errorLabelContainer:'#error', wrapper:'li', success:function($label,element) { console.log($label); console.log(element); }, highlight:function(element,errorClass,validClass){ $(element).css('background','red'); }, unhighlight:function(element,errorClass,validClass){ $(element).css('background','#fff'); } }); }); </script> <style type="text/css"> form { margin: 10px 100px 10px 100px; } </style> </head> <body> <div id="info" style="height: 30px;background: green;display: none"> 出現錯誤了 </div> <form id="form1"> <div> field1:<input type="text" name="field1" /> </div> <div> <input type="submit" name="submit" value="submit"/> </div> </form> <ol id="error"></ol> </body> </html>