设计之家 > 教程 > 網頁教程 > HTML教程 >

HTML語言剖析(八) 表單標記(2)

作者:佚名 來源:太平洋網絡學院 時間:2006-12-25

 

  輸入方式三: Checkbox (確認盒)

  例如:<input type="Checkbox" name="idol" value="Leon" align="RIGHT" checked>

  ● type="Checkbox"
  輸入方式為 Checkbox,能產生一確認盒,以供剔選。

  ● name="idol"
  此一 Checkbox 名稱,參考 Text 部分的說明。

  ● value="Leon"
  內定值。每一個 Checkbox 必須及僅有一個 value,當被剔選時這值便會傳及 CGI,例如所傳字串 idol=Leon 。

  ● align="RIGHT"
  可選值:top, middle, bottom, left, right, texttop, baseline, absmiddle。
 
  ● checked
  設該 Checkbox 為內定被選。每個 Checkbox 都是獨立的,所以每一個都可使用這 參數,不像 Radio。
  
  例子:

原始碼<form action="http://your.isp.com/cgi-local/example.cgi" method="POST">
你喜歡以下那些明星:
<br><input type="Checkbox" name="idol01" value="Leon">黎明
<input type="Checkbox" name="idol02" value="Noriko_Sagai">酒井法子
<input type="Checkbox" name="idol03" value="Leon">鄭秀文
<input type="Checkbox" name="idol04" value="BonJovi" checked>BonJovi
</form>
顯示結果
你喜歡以下那些明星:
黎明 酒井法子 鄭秀文 BonJovi

  輸入方式四: Password (密碼輸方盒)

  例如:<input type="Password" name="pw" value="999" align="MIDDLE" size="5" maxlength="9">

  ● Password 的其他參數和 Text 是完全相同的,請參考 Text 的介紹。
兩者作用不同,Password 所輸入的字元全以 * 號表示。

  例子:

原始碼<form action="http://your.isp.com/cgi-local/example.cgi" method="POST">
請輸入姓名:<input type="Text" name="name">
<br>請輸入密碼:<input type="Password" name="pw" maxlength="9">
</form>
顯示結果
請輸入姓名:
請輸入密碼:

 

  輸入方式五: Submit (傳送鍵)及 Reset (清除鍵)

  這是表單上重要的兩個按鍵,兩者所附帶的參數相同,但用處不大。

  例如:<input type="Submit" name="other_funtion" value="確定" align="MIDDLE">
<input type="Reset" value="清除" align="MIDDLE">

  ● type="Submit"
  設定輸入方式為 Submit 或 Reset。

  ● name="other_funtion"
  Submit 的功能隨 name 的不同而不同,須和 CGI 配合。若你只需要普通的傳送 鍵,則是其內定,不必用此參數。

  ● value="確定"
  這個值不是輸給 CGI 的,而是顯示在按鍵上,可以不用,傳送鍵的內定值為 Submit Query,清除鍵的內定值為 Reset。

  ● align="MIDDLE"
  可選值:top, middle, bottom, left, right, texttop, baseline, absmiddle。

  例子:

原始碼<form action="http://your.isp.com/cgi-local/example.cgi" method="POST">
<input type="Submit"><input type="Reset">
<br><input type="Submit" value="         確定         "><input type="Reset" value="清除">
</form>
顯示結果

  輸入方式六: Image (圖片按鍵)

  這通常用以取代 Submit 及 Reset 兩個按鍵,因為由程式產生的按鍵并不漂亮,這 Image 參 數便容許你采用自已制造的按鍵。

  例如:<input type="Image" name="submit" align="BOTTOM" src="ex_icon.gif">

  ● type="Image"
  輸入方式為 Image。

  ● name="submit"
  所要代表的按鍵,可以是 submit, reset, 或其它。

  ● align="BOTTOM"
  可選值:top, middle, bottom, left, right, texttop, baseline, absmiddle。

  ● src="ex_icon.gif"
  按鍵圖片來源,若此圖片文件不與該 html 文件在同一目錄下,請加上相對或絕對途徑。

原始碼<form action="http://your.isp.com/cgi-local/example.cgi" method="POST">
<input type="Image" name="submit" align="BOTTOM" src="ex_icon.gif">
</form>
顯示結果

 

  輸入方式七: File

  例如:<input type="File" name="upload" align="BOTTOM" size="20" maxlength="100" accept="text/html">

  ● input type="File"
  輸入方式為 Image。通常用以傳輸文件。

  ● name="upload"
  這文件傳輸的名稱,用以識別之用。

  ● align="BOTTOM"
  可選值:top, middle, bottom, left, right, texttop, baseline, absmiddle。

  ● size="20"
  所顯示文字盒的長度。

  ● maxlength="100"
  可輸入字元的上限。

  ● accept="text/html"
  所接受的文件類別,有二十六種選擇,但可不設定。

  例子:

始碼<form action="http://your.isp.com/cgi-local/example.cgi" method="POST">
<type="File" name="upload" size="30" maxlength="100" accept="text/html">
</form>
顯示結果

  輸入方式八: Hidden

  例如:<input type="Hidden" name="ID" value="6618">

  ● type="Hidden"
  輸入方式為隱藏或內定。它不會顯示任何輸入介面,而是一個內定值隨表單一起 傳給 CGI,列如由 CGI 產生的會員號碼,或傳入可更改的參數以調整 CGI 而避免 修改 CGI 程式碼。

   ● name="ID"
  這文件傳輸的名稱,用以識別之用。

  ● value="6618"
  內定值,會以如 ID=6618 形式傳給 CGI。

  例子: ("Hidden" 是不被顯示的,所以這處多放了一個 "Submit" 鍵,表示 Hidden 之內定 值會隨 submit 鍵被按而傳給 CGI)

原始碼<form action="http://your.isp.com/cgi-local/example.cgi" method="POST">
<input type="Hidden" name="ID" value="6618">
<input type="Submit" value="Submit">
</form>
顯示結果

 

标签:HTML語言

推薦設計

最新文章