<div class="codetitle"> <span><a style="CURSOR: pointer" data="69286" class="copybut" id="copybut69286" onclick="doCopy('code69286')"><u>複製程式碼</u></a></span> 程式碼如下:</div> <div class="codebody" id="code69286"> <br> <br> <br> <br><meta http-equiv="Content-Type " content="text/html; charset=UTF-8"> <br><title>表單驗證</title> <br><script language="javascript"> <BR>function check_1(param){//不param){//不param為空<BR>if(param==""||param==null){return false;}else{return true;} <BR>} <BR>function check_2(param){//長度限制,字母是10個,漢字也是10個<BR>if(param.length>10){return false;}else{return true;} <BR>} <BR>function check_3(param){//只能輸入漢字<BR>var pattern= /^[u4e00-u9faf] $/; <BR>var flag = pattern.test(param); <BR>if(flag==false){return false;}else{return true;} <BR>} <BR>function check_4(param){//只能輸入數字<BR>var pattern= /^[0-9] $/; <BR>var flag = pattern.test(param); <BR>if (flag==false){return false;}else{return true;} <BR>} <BR>function check_5(param){//只能輸入數字字母下劃線<BR>var pattern= /^[0-9a -zA-z_] $/; <BR>var flag = pattern.test(param); <BR>if(flag==false){return false;}else{return true;} <BR>} <BR>function check_6(param){//郵箱格式驗證<BR>var pattern= /^([a-zA-Z0-9] [_|_|.]?)*[a-zA-Z0-9] @([ a-zA-Z0-9] [_|_|.]?)*[a-zA-Z0-9] .[a-zA-Z]{2,3}$/; <BR>var flag = pattern .test(param); <BR>if(flag==false){return false;}else{return true;} <BR>} <BR>function check_7(param){//網址格式驗證<BR>var pattern = /^((https|http|ftp|rtsp|mms)?://)?(([0-9a-z_!~*'().&= $%-] : )?[0-9a- z_!~*'().&= $%-] @)?(([0-9]{1,3}.){3}[0-9]{1,3}|([0-9a -z_!~*'()-] .)*([0-9a-z][0-9a-z-]{0,61})?[0-9a-z].[a-z]{2, 6})(:[0-9]{1,4})?((/?)|(/[0-9a-z_!~*'().;?:@&= $,%#-] ) /?)$/; <BR>var flag = pattern.test(param); <BR>if(flag==false){return false;}else{return true;} <BR>} <BR>function check (){ <BR>var value=document.getElementById("testValue").value; <BR>var result=check_7(value);//在這裡設定驗證函數的名稱,我寫了check_1~check_7七個常用的表單驗證函數<BR>if(result==false){ <BR>document.getElementById("testValue").style.border="2px solid red"; <BR>}else{ <BR>//document. getElementById("testValue").style.border="2px solid green"; <BR>document.getElementById("testValue").style.border=""; <BR>} <BR>} <BR></script> <br> <br> <br><div style="text-align: center;padding: 200px 0;"> <br>請輸入: <input id="testValue" name="" class="" type="text" style="width:200px;height:30px;"> <br><input id="" name="" class="" type="button" value="點選驗證" style="width:70px;height:30px;" onclick="check()"> <br> </div> <br> <br> <br> </div>