jQuery Validate 小案例,讓你瞭解jQueryValidate
阿新 • • 發佈：2019-02-16
下面這是我的一個小程式<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="js/jquery-3.2.1.js" type="text/javascript"></script> <script src="js/jquery.validate.js" type="text/javascript"></script> <script> $(document).ready(function () { $('#formTest').validate({//jquery是表單驗證 onfocusout: function(element) { $(element).valid(); },//這是定義滑鼠失去焦點則觸發,預設的是點選提交之後驗證 rules: {//定義驗證規則 name1: { required: true, },//此文字框是否是必填,此處寫的是文字框的name屬性,不是id,摺痕重要 password: { required: true,minlength:2 }//minlength是限制長度,最少2個字元 }, messages: { name1: {required:"name"},//這是用來顯示出錯的資訊,預設是英文,如果要是讓顯示中文,需要匯入validate_messages password: { required: "password",//如果什麼都不填就會在password後面顯示password minlength: jQuery.validator.format("{0}Password"), //{0}是接收minlength的值 } } }); }); </script> </head> <body> <form id="formTest" action="" method="post"> <span>使用者名稱:</span><input type="text" id="name1" name="name1"><br/> <span>密 碼:</span><input type="text" id="password" name="password"><br/> <button name="登入" value="登入">登入</button> </form> </body> </html>
這是我的一個小程式,剛開始從網上下載了很多愛麗,但是都沒有成功,最後自己嘗試很多次之後終於可以運行了.在這裡面有很多重要的點.在這裡再給大家提示一下: 1.預設的錯誤提示是英文. 2.規則和錯誤裡面,寫的是name屬性,不是id 3.jquery validate預設的是form提交,就是點選submit按鈕之後,才會顯示錯誤. 4.如果表單中沒有submit也是可以的,那就需要使用焦點失去之後進行驗證. 重要提示:在jQuery Validate中,必須使用form提交,但是如果你沒有想要提交的東西,還又想要驗證,那麼你可以使用焦點失去驗證,來改變他預設的submit提價就可以了.
我自己上傳了一點jQuery的.js檔案,大家如果有需要可以去下載,不需要積分http://download.csdn.net/detail/qq_37962402/9914743