使用JavaScript驗證表單

驗證表單中的文本輸入欄位

<script language="javascript"><br />//判斷是否為英文字母<br />function isEnglish(name){<br />if(0 == name.length){<br />return false;<br />}<br />for(i=0; i<name.length; i++){<br />if(65>name.charCodeAt(i) || 128<name.charCodeAt(i)){<br />return false;<br />}<br />}<br />return true;<br />}</p><p>//判斷是否為中文漢字<br />function isChinese(name){<br />if(0 == name.length){<br />return false;<br />}<br />for(i=0; i<name.length; i++){<br />if(128 < name.charCodeAt(i)){<br />return true;<br />}<br />}<br />return false;<br />}</p><p>//判斷sourceStr中是否包含errorStr中的某個字元<br />function contain(sourceStr, errorStr){<br />var i;<br />for(i=0; i<errorStr.length; i++){<br />if(sourceStr.indexOf(errorStr.charAt(i)) >= 0){<br />return true;<br />}<br />return false;<br />}<br />}</p><p>//用於判斷手機號碼或者銀行帳號的函數。可擴充到網域名稱註冊等<br />function isNumber(String){<br />var c;<br />var Letters = "0123456789"; //自訂可輸入值。即只能為數字，適用於手機號或銀行帳號的驗證<br />if('0' == String.charAt(0)){<br />return false; //所輸入的手機號碼，不能以'0'開頭<br />}<br />/*<br />if('0' == String.charAt(String.length-1)){<br />return false; //所輸入的手機號碼，不能以'0'結尾<br />}<br />*/<br />for(i=0; i<String.length; i++){<br />c = String.charAt(i);<br />if(0 > Letters.indexOf(c)){<br />return false; //只能輸入Letters中所限定的字元<br />}<br />}<br />return true;<br />}</p><p>//表單驗證<br />function examine(){<br />if(""==document.form11.username.value || !isChinese(document.form11.username.value)){<br />alert("使用者名稱不可為空，且只能為中文漢字");<br />document.form11.username.focus();<br />return false;<br />}<br />if(6<document.form11.username.value.length || 2>document.form11.username.value.length){<br />alert("使用者名稱的中文字數僅限於2~~6個之間");<br />document.form11.username.focus();<br />return false;<br />}<br />if(""==document.form11.tel.value || !isNumber(document.form11.tel.value) || 11!=document.form11.tel.value.length){<br />alert("手機號碼不可為空，且必須由11個阿拉伯數字組成，且手機號碼的首位不能為零");<br />document.form11.tel.value = "";<br />document.form11.tel.focus();<br />return false;<br />}<br />if("" == document.form11.oldPassword.value){<br />alert("原始密碼不可為空");<br />document.form11.oldPassword.focus();<br />return false;<br />}<br />if("" == document.form11.newPassword.value){<br />alert("新密碼不可為空");<br />document.form11.newPassword.focus();<br />return false;<br />}<br />if("" == document.form11.reNewPassword.value){<br />alert("確認密碼不可為空");<br />document.form11.reNewPassword.focus();<br />return false;<br />}<br />if(document.form11.newPassword.value != document.form11.reNewPassword.value){<br />alert("兩次輸入的新密碼不一致");<br />document.form11.newPassword.value = "";<br />document.form11.reNewPassword.value = "";<br />document.form11.newPassword.focus();<br />return false;<br />}<br />//var idx = document.form11.email.value.indexOf("@");<br />//if(idx<=0 || idx==document.form11.email.value.length-1){// TODO....}<br />if(null == document.form11.email.value.match("@") || contain(document.form11.email.value,"%/(/)><")){<br />alert("Email格式不正確");<br />document.form11.email.focus();<br />return false;<br />}<br />if(confirm("是否確定註冊為本站會員？/n/n請確認！！")){<br />return true;<br />}else{<br />return false;<br />}<br />}<br /></script><br /><form name="form11" id="form11" action="#" method="POST"><br />使用者：<input type="text" name="username" id="username"/><br/><br />手機：<input type="text" name="tel" id="tel"/><br/><br />原密碼：<input type="password" name="oldPassword" id="oldPassword"/><br/><br />新密碼：<input type="password" name="newPassword" id="newPassword"/><br/><br />確認密碼：<input type="password" name="reNewPassword" id="reNewPassword"/><br/><br />郵箱地址：<input type="text" name="email" id="email"/><br/><br /><input type="button" value="測試表單驗證" onClick="examine()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br /><input type="submit" value="點我也可以驗證" onclick="javascript:return examine()"/></form>

 

使用<input type="button"/>提交表單時，彈出的確認框

<script language="JavaScript"><br />function edit(){<br />document.forms[0].method.value="edit";<br />document.forms[0].submit();<br />}<br />function del(){<br />if(confirm('您確定要刪除所選中的評論嗎？')){<br />document.forms[0].method.value="delete";<br />document.forms[0].submit();<br />}<br />}<br /></script><br /><form action="#" method="POST"><br /><input type="hidden" name="method" value=""><br /><input type="button" onclick="edit()" value="編輯" />    <br /><input type="button" onclick="del()" value="刪除" /><br /></form>

使用<a href="#"></a>連結發送請求時，彈出的確認框

<script type="text/javascript"><br />function del() {<br />if (confirm("您確定要刪除該篇文章嗎？/n/n請確認！")){<br />return true;<br />}else{<br />return false;<br />}<br />}<br /></script><br /><a href="#" onclick="javascript:return del()"><img src="#" border="0" alt="刪除"></a><br /><%--<br />還有一種更簡便的辦法，如下所示<br /><a href="javascript:if(confirm('確定要刪除嗎?')){location='<%=request.getContextPath()%>/delete.jsp?isDelete=true&page=2'}">刪除</a><br />--%>