Tad 教材網 - 線上書籍

:::

4-2 電話簿+垂直捲軸

5-1 mem.php next

\[982\]PHP網站開發 進階應用技巧
=====================

[![](http://tad0616.net/uploads/dl.gif)](http://120.115.2.76/tad/tad_book3/file/9802/05.zip)

### 一、利用jqoery的formValidator進行表單驗證

官方網站：<http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/>

<font color="#3366ff"><link rel="stylesheet" href="formValidator/css/validationEngine.jquery.css" type="text/css" media="screen" charset="utf-8" />  
 <link rel="stylesheet" href="formValidator/css/template.css" type="text/css" media="screen" title="no title" charset="utf-8" />  
   
 <script src="formValidator/js/jquery.js" type="text/javascript"></script>  
 <script src="formValidator/js/jquery.validationEngine-tw.js" type="text/javascript"></script>  
 <script src="formValidator/js/jquery.validationEngine.js" type="text/javascript"></script>  
 <script type="text/javascript">  
 $(document).ready(function() {  
 $("#myform").validationEngine({  
 inlineValidation: true,  
 success : false,  
 failure : function() {}  
 });  
 });  
 </script></font>

(1) 提示的位置：「promptPosition: "topRight", 」選項有：topLeft, topRight, bottomLeft, centerRight, bottomRight

(2) 是否邊輸入邊檢查：「inlineValidation: true,」

2.表單要做的變化：記得在<form>中加入id="myform"，要對應上面的$("#myform")。

3.在欄位中加入參數：<input name="id" type="text" id="id" class="validate \[required , custom\[onlyLetter\] , length\[0,10\]\]">

(1) optional：非必填，當有填入值才會觸發驗證機制

(2) required：必填欄位用

(3) custom\[\]：自訂驗證

a.onlyNumber : 只能填數字

b.noSpecialCaracters :禁止填入特殊符號

c.onlyLetter : 只能填入大小寫英文字

d.telephone : 驗證電話號碼規則

e.email : 驗證email 規則

f.date : 日期格式驗證，格式一律為YYYY-MM-DD

(4) length\[0,20\]：只允許 ~20個字元之間

(5) maxCheckbox\[5\]：最多可核選5個

(6) minCheckbox\[2\]：最多可核選2個

(7) confirm\[欄位名稱\]：和另一個欄位進行比對（常用於密碼）

4.單選鈕的寫法：<input name="sex" type="radio" value="男" class="validate\[required\] radio">

5.複選鈕的寫法：<input name="hobby" type="checkbox" id="hobby" value="琴" class="validate\[minCheckbox\[2\]\] checkbox">

### 二、即時進行帳號驗證

1.在該欄位驗證中加入：,ajax\[ajaxUser\]，此名稱在jquery.validationEngine-tw.js中定義

2.驗證用的檔名需要在jquery.validationEngine-tw.js中修改

3.驗證用的php檔寫法請參考：mem\_chk.php，驗證用的php檔會接收到的值：

(1) 變數名稱：$\_POST\['validateId'\];（例如：id）

(2) 變數值：$\_POST\['validateValue'\];（例如：tad）

(3) 使用的驗證名稱：$\_POST\['validateError'\];（例如：ajaxUser）

4.驗證用的php檔，不管過程為何，最後只要能輸出「{"jsonValidateReturn":\["變數名稱","使用的驗證名稱","結果"\]}」即可，如：

(1) 帳號可使用：「{"jsonValidateReturn":\["id","ajaxUser","true"\]}」

(2) 帳號不可使用：「{"jsonValidateReturn":\["id","ajaxUser","false"\]}」

:::

搜尋

進階搜尋

QR Code 區塊

https%3A%2F%2Fmail.tad0616.cp27.secserverpros.com%2Fmodules%2Ftad_book3%2Fmarkdown.php%3Ftbdsn%3D194

快速登入

書籍目錄

展開 | 闔起

線上使用者

50人線上 (11人在瀏覽線上書籍)

會員: 0

訪客: 50

更多…

MarkDown

搜尋

QR Code 區塊

快速登入

書籍目錄

線上使用者