表單的驗證

          提交表單后,需要對信息進行驗證。表單的驗證有兩種:客戶端驗證和服務器驗證。

          ? 1 )表單的客戶端驗證

          ?????? 表單的客戶端驗證主要是通過 JavaScript 來完成的。

          <html>

          <head>

          <title> 客戶端驗證 </title>

          <Script>

          function Check()

          {

          ??? username=document.form1.username.value;

          ??? age=document.form1.age.value;

          ??? year=document.form1.year.value;

          ??? email=document.form1.email.value;

          ?

          ?

          ?

          ??? <!-- 驗證提交數據的長度 -->

          ??? if(username.length<2||username.length>8)

          ??? {

          ????? alert(" 用戶名長度必須在 2 位到 8 位之間 ");

          ????? return false;

          ??? }

          ?

          ??? <!-- 驗證提交數據的范圍 -->

          ??? if(age.length!=2||isNaN(age)||parseInt(age)<20||parseInt(age)>50)

          ??? {

          ????? alert(" 你的年齡不符合我們的要求! ");

          ????? return false;

          ??? }

          ?

          ??? <!-- 驗證提交數據的類型 -->

          ??? <!-- 限定出生年份是一個 4 位整數 -->

          ??? if(year.length!=4||isNaN(year))

          ??? {

          ????? alert(" 年份填寫不正確! ");

          ????? return false;

          ??? }

          ??? <!-- 限定電子郵箱不能為空,且必須要有“ @ ”和“ . -->

          ??? if(email.length==""||(email.indexOf('@')==-1)||(email.indexOf('.')==-1))

          ??? {

          ????? alert(" 電子郵件填寫不正確! ");

          ????? return false;

          ??? }

          ??? return true;

          }

          </Script>

          </head>

          <body>

          <h3> 客戶端驗證 </h3>

          <form name="form1" action="X.jsp" OnSubmit="return Check();">

          <p> 名: <input name="username"></p>

          <p> &nbsp;&nbsp;&nbsp;&nbsp; 齡: <input name="age"></p>

          <p> 出生年份: <input name="year"></p>

          <p> 電子郵件: <input name="email"></p>

          <p><input type=Submit value=" 提交 "></p>

          </form>

          </body>

          </html>

          ? 2 )表單的服務器端驗證

          ?????? 表單的服務器端驗證是通過服務器端的 X.jsp 來完成的。

          <html>

          <head>

          <title>A Form</title>

          </head>

          <body>

          <h3>The form will be checked by the Server.</h3>

          <form name="fm" action="XXX.jsp" method="post">

          ? <p>UserName:

          ??? <input type="text" name="username">

          ? </p>

          ? <p>PassWord:

          ??? <input type="password" name="password">

          ? </p>

          ? <p>BirthYear:

          ??? <input type="text" name="birthyear">

          ? </p>

          ? <p><center>

          ??? <a href='JavaScript:fm.submit();'> 提交 </a>

          ??? <a href='JavaScript:fm.reset();'> 重置 </a>

          ? </center></p>

          </form>

          </body>

          </html>

          posted on 2006-12-28 17:38 youngturk 閱讀(277) 評論(0)  編輯  收藏 所屬分類: JavaScript

          <2006年12月>
          262728293012
          3456789
          10111213141516
          17181920212223
          24252627282930
          31123456

          導航

          統計

          公告

          this year :
          1 jQuery
          2 freemarker
          3 框架結構
          4 口語英語

          常用鏈接

          留言簿(6)

          隨筆分類

          隨筆檔案

          文章分類

          文章檔案

          相冊

          EJB學習

          Flex學習

          learn English

          oracle

          spring MVC web service

          SQL

          Struts

          生活保健

          解析文件

          搜索

          最新評論

          閱讀排行榜

          評論排行榜

          主站蜘蛛池模板: 普洱| 澎湖县| 抚松县| 武陟县| 陈巴尔虎旗| 泰安市| 勃利县| 宁河县| 遵义县| 阿勒泰市| 开封市| 蓬莱市| 德昌县| 美姑县| 乌拉特中旗| 乐至县| 祁连县| 乾安县| 友谊县| 仙桃市| 泸溪县| 新乡市| 彰武县| 扬州市| 荣成市| 乌兰浩特市| 文成县| 西藏| 芜湖市| 壤塘县| 岳阳市| 临颍县| 区。| 北流市| 米易县| 武威市| 泰兴市| 都昌县| 陕西省| 桂阳县| 三门峡市|