使用Javascript實現客戶端資料驗證
阿新 • • 發佈：2019-02-14
</pre><p>1.獲取表單中輸入的資料</p><p>2.驗證表單中輸入的資料</p><pre name="code" class="html"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en_US" xml:lang="en_US"> <head> <title> </title> <script> function validate(){ var at = document.getElementById("email").value.indexOf("@"); var age = document.getElementById("age").value; var fname = document.getElementById("fname").value; submitOK = "true"; if(fname.length==0 || fname.length>10){ alert("姓名必須輸入1到10個字元"); submitOK="false"; }else if(isNaN(age) || age<1 || age>100){ alert("年齡必須是1與100之間的數字"); submitOK="false"; }else if(at == -1){ alert("不是有效的電子郵件地址"); submitOK="false"; } if(submitOK == "false"){ return false; } } </script> </head> <body> <form action="" onsubmit="return validate()"> 姓名:<input type="text" id="fname" size="20"><br/> 年齡:<input type="text" id="age" size="20"><br/> 電郵:<input type="text" id="email" size="20"><br/> <input type="submit" value="提交"> <form> </body> </html>