# 加載方式 ## Class加載 ``` <input id="email" class="easyui-validatebox" data-options="required:true,validType:'email'" /> ``` ## JS調用加載 ``` <input id="email" /> <script> $(function () { $('#email').validatebox({ required : true, validType : 'email', }); }); </script> ``` # 屬性列表 | 屬性名 | 值 | 說明 | | --- | --- | | required | boolean | 定義為必填字段。默認為 false。| | validType | string,array| 定義字段驗證類型，比如：email、url、length[0,100] 、remote['url','paramname']。默認值為：null。| | delay | number | 延遲到最后驗證輸入值。默認值200。| | missingMessage | string| 當文本框未填寫時出現的提示信息。默認值：This field is required。| | invalidMessage | string | 當文本框的內容被驗證為無效時出現的提示。默認值 null。| | tipPosition | string | 定義當文本框內容無效的時候提示消息顯 示 的 位 置 ， 有 效 的 值 有 ：'left','right'。默認值 right。| | deltaX | number | 提示框在水平方向上位移。默認值0。| | novalidate| boolean 為 | true 時關閉驗證功能。默認值 false。| *** ``` //屬性設置 $('#email').validatebox({ required : true, validType : 'email', //validType : 'url', //validType : 'length[2,20]', //validType : ['email', 'length[10,20]'], //validType : 'remote["content.php", "username"]', //delay : 3000, missingMessage : '請填寫電子郵件', invalidMessage : '電子郵件格式不正確', tipPosition : 'right', deltaY : 120, novalidate : true, }); //Ajax 遠程驗證 if ($_POST['username'] == 'Lee') { echo 'true'; } else { echo 'false'; } ``` # 方法列表 | 方法名 | 傳參 | 說明 | | --- | --- | | options | none | 返回屬性列表。| | destroy | none | 移除并銷毀組件。| | validate | none | 驗證文本框的內容是否有效。| | isValid | none | 調用 validate 方法并且返回驗證結果，true 或者 false。| | enableValidation | none | 啟用驗證。 | | disableValidation | none | 禁用驗證。| *** ``` //銷毀組件 $('#email').validatebox('destroy'); //驗證碼文本框是否有效 console.log($('#email').validatebox('validate')); //返回驗證的結果 console.log($('#email').validatebox('isValid')); //禁用和啟用 $('#email').validatebox('disableValidation'); $('#email').validatebox('enableValidation'); //可以使用$.fn.validatebox.defaults 重寫默認值對象。 ``` # 自定義驗證 ``` //新增一個規則 $.extend($.fn.validatebox.defaults.rules, { minLength : { validator : function (value, param) { return value.length >= param[0]; }, message : '請長度不小于{0}的字符', }, }); //調用 $('#email').validatebox({ required : true, validType : 'minLength[5]', }); ```