JavaScript 表單驗證

表單的輸入框、下拉框等可以接收使用者輸入，所以用JavaScript來操作表單，可以得到使用者輸入的內容，或是對一個輸入框設定新的內容。

HTML表單的輸入控制項主要有以下幾種：

文字框，對應的<input type="text">，，用於輸入文字；

單選框，對應的<input type="radio">，用於選擇一項；

##複選框，對應的<input type="checkbox">

，用於選擇多項；

下拉框，對應的<select>

，用於選擇一項；

隱藏文本，對應的<input type="hidden">

，使用者不可見，但表單提交時會把隱藏文字送到伺服器。

JavaScript 表單驗證

JavaScript 可用來在資料送到伺服器前對 HTML 表單中的這些輸入資料進行驗證。

表單資料經常需要使用 JavaScript 來驗證其正確性：

驗證表單資料是否為空？

驗證輸入是否是一個正確的email位址？
驗證日期是否輸入正確？
驗證表單輸入內容是否為數字型？

下面的函數用來檢查使用者是否已填入表單中的必填（或必填）項目。假如必填或必選項為空，那麼警告框會彈出，並且函數的回傳值為false，否則函數的回傳值則為true（表示資料沒有問題）：

function CheckForm (){ 
if (document.form.name.value.length == 0) { 
alert("請輸入您姓名!");
document.form.name.focus( );
return false;
}
return true;
}

#中文/英文/數字/郵件地址合法性判斷:

##function isEnglish(name) //中文值偵測{ 
if(name.length == 0)
return false;
for(i = 0; i < name. length; i++) { 
#if(name.charCodeAt(i) > 128)
return false;
}
return true;
}

function isChinese (name ) //中文值偵測
{ 
if(name.length == 0)
return false;
for(i = 0; i < name.length; i++) { 
if (name.charCodeAt(i) > 128)
return true;
}
return false;
}

function isMail(name) // 電子郵件值偵測
{ 
if(! isEnglish(name))
return false;
i = name.indexOf(" at ");
j = name dot lastIndexOf(" at ") ;
if (i == -1)
return false;
if(i != j)
return false;
if(i == 名稱點長度)
return false;
return true;
}

function isNumber(name) // 數值偵測
{ 
if(name.length == 0)
return false;
for(i = 0; i < name.length; i++) { 
#if(name.charAt(i) < "0" || name.charAt(i) > "9")
return false;
}
return true;
}

function CheckForm()
{ 
if(! isMail(form.Email.value)) { 
alert("您的電子郵件不合法！ isEnglish(form.name.value)) { 
alert("中文名稱不合法！");
form.name.focus();
return false;
}
if( !isChinese(form.cnname.value)) { 
alert("中文名稱不合法！");
form.cnname.focus();
return false;
}
if (!isNumber(form.PublicZipCode.value)) { 
alert("郵遞區號不合法！");
form.PublicZipCode.focus();
return false;
}
傳回true;
}

下一節