我們在 Dreamweaver 中, 插入表單時, 總會帶出一堆設定值, 現在就開始來慢慢研究, 每個值的代表意義
表單是由 <form> 標籤開始，結尾使用 </form> 標籤，
兩個標籤之間就是放置表單元素的地方，form 會將線上填寫的資料，
action 是傳送至所設定的資料傳送目的地，進行資料的接收，
method 是資料傳遞的方式，有 get 與 post 兩種方式
常見表單元素:
一. 單行文字輸入欄位 input type= text
基本語法
單行的表單文字輸入欄位，參數有
input="text" 是最重要的，
name 是給這個欄位一個名稱，
value 是給這個欄位一個值，若是要線上輸入資料的欄位，value 可以不用寫。
EX:
當網友填寫完資料並送出表單後，伺服器端的 PHP 程式就可以接收 name=UserName 的欄位值，就是所填寫的姓名資料。
二. 多行文字輸入欄位 textarea
textare 的內容可以分段落、換行，如留言板的內文可用 textarea 來製做。
textarea 標籤語法
<textarea> name 是欄位名稱。
DW中, 點擊 <textarea> 可設定字元寬度和行數
textarea name="欄位名稱" cols="50" rows="5"
css 的寬度（width）與高度（height）來控制 textarea 大小
textarea name="Content" style="width:400px;height:120px;
三. 顯示表單按鈕 (submit, button, reset) 語法
如何區分 submit 以及 button ，
submit 送出表單按鈕顧名思義就是用來將表單資料送出的功能，
而 button 則使用在表單內的其他互動功能。
送出表單按鈕 submit
input type="submit" name="按鈕名稱" value="按鈕上的文字" style="按鈕樣式"
EX:
input type="submit"-表單送出按鈕，這個按鈕叫做 SB，當送出表單之後，
後端的接收程式就會接收到網友填寫在 name="UserName" 文字欄位內的資料以及按鈕 SB 的值，而 submit 的 value="send"，
submit 的 value 是可以更改的。
顯示表單按鈕 button -> 使用者自行設計的按鈕
input='button' - 可加入 JavaScript 的語法，來設計互動特效，搭配上 AJAX 的許多應用，可以讓單純的 Form 功能變得更強大。
顯示表單按鈕 button 語法
EX:
input type="button" name="Submit" value="繼續購物" onclick="window.location='index.php'"
點擊繼續購物按鈕時, 會連結至 index.php 頁面
input type=reset, 還原表單內的資料為內定值
四 表單核取方塊 checkbox -可複選的項目
表單核取方塊 checkbox 基本語法
input type="checkbox" name="" value=""
input type="checkbox" 是宣告選項按鈕，
name 是選項的名稱，同一組選項的名稱可以是相同的
value 是選項的值，
EX: name 相同, 為同一組選項, 可選取 1-5 項
五. 表單選項按鈕 radio buttons - 單一選項的功能模組，一次呈現所有的選項
表單選項按鈕 radio buttons 基本語法 input type="radio" name="" value=""
type="radio" 是選項按鈕，
name 是＂整組 radio button＂的名稱，瀏覽器會限制相同 name 的 radio button 內，僅能選擇一個項目。
value 是按鈕的值。
EX: name 的選項按鈕內，並未限制最多選項數目。但網友在所有選項中, 僅能選擇其一
如果有預設選項, 可加上 checked="true"
在DW中可設定 已核取也有同樣效果
六. 表單下拉選單 select option - 每一組 select option 都是單選
下拉選單 select option 基本語法
select name="選單名稱"><option>選項值</option>
select 標籤開始，到 /select 結束，
<option> 則是每個選項，可以很多組，
每個選項值都要不一樣
EX: selected="selected" 為預設選項, 當選取後, 選取值為 selected="selected"
七. 表單隱藏欄位 input type=hidden
是用來儲存一些表單資訊，而不想要直接顯示在表單上，
藉著隠藏欄位傳遞各種表單資訊給後端的程式。
表單隱藏欄位 input type=hidden 基本語法
input type="hidden" name="隱藏欄位名稱" value="隱藏欄位值"
八. 表單隱藏欄位 input type=hidden 基本語法
input type="hedden" 宣告一個隱藏欄位，
通常還會有 name 以及 value 兩個參數，分別代表欄位的名稱與欄位的值。
九. 密碼輸入欄位 input type= password
登入頁面通常會有文字輸入欄位（input type= text）
以及密碼輸入欄位（input type= password），
這兩個欄位差別在於密碼輸入欄位在填寫時，僅會顯示隱藏符號，黑點（●）或星號（*）等，用來保護輸入密碼時的隱私。
在用DW製作表單時, 總會出現 id和 name 還不是很清楚其間關係的我, 先記錄於下
HTML元素的ID和Name屬性的區別
簡單說明: ID就像是一個人的身份證號碼，而Name就像是他的名字，ID顯然是唯一的，而Name是可以重複的。
部分狀況下 id 和 name 是可以互通的，所以常常會讓人搞混，
但是其根本的定義可以讓我們很容易分辨其差別：
name 是識別網頁上某個控制項的名稱，
這些控制項多半都是 Windows 或 IE 內建的物件，
例如 Frame（其實就是 IE 瀏覽器物件）、TextArea（系統內建物件）、
URI 物件（IE 內建物件）等等。牽涉到 name 的動作，
多半都是資料的傳輸或是連結的開啟等等。
id 是識別網頁上某個 DHTML 物件的名稱，
對象是所有的 HTML 元件。牽涉到 id 的動作，
多半是做動態效果的控制之用。
0 意見:
張貼留言