10-6 表單
一、HTML Form 語法
<form action="資料傳送目的地" method="資料傳遞方式">
表單內容與表單元素
</form>
標準的 HTML 表單是由 <form> 標籤開始,結尾使用 </form> 標籤,兩個標籤之間就是放置表單元素的地方,form 會將網友填完的資料,傳送至 action 所設定的資料傳送目的地,例如傳給一個 PHP 頁面,進行資料的接收,method 是資料傳遞的方式,有 get 與 post 兩種方式。
二、表單元件
- <input type="格式" name="名稱" size="大小" value="預設值" placeholder="佔位字元">
- 格式有:text(文字框)、hidden(隱藏框)、password(密碼框)、file(上傳框)、submit(送出鈕)、reset(清除鈕)
- 其中的 name 最重要!一定要有!因為 name 送出後,會變成 PHP 的變數名稱。
- 例如表單有個:<input type="text" name="tel">,表單送出後,方法若用 post,那麼會得到 $_POST['tel'] 變數;若是用 get,那就是 $_GET['tel']
三、其他常用的表單元件 HTML 語法及屬性
- 用<button type=”submit”>按鈕文字</button>也可做出按鈕效果
- 單選框:<input type="radio" name="名稱" value="值 1">選項文字 1
- (1) 單選框通常會有好幾個選項,一組選項就要一組<input>,name 都要一樣才行!
- (2) 若要預設選取,要加上 checked="checked"
- (3) 可以用<label for="id">選項</label>,以便點選文字就可以勾選該項目。
- 複選框:<input type="checkbox" name="名稱[]" value="值 1">選項文字 1
- (1) 複選框通常同時會有好幾個選項,一組選項就要一組<input>
- (2) name 都要一樣才行!而且因為是複選,所以 name 要加上[],如此會送出陣列。
- (3) 若要預設選取,要加上 checked="checked"
- 下拉選單:<select name="名稱" size=1>選項</select>
- (1) 選項:<option value="值">選項文字</option>
- a. 一組選項,就是一組<option>
- b. 若要預設選取:要在<option>中加入 selected="selected"
- (2) 若希望下拉選單可以複選,除了 name 要加上[]外,還要加上 multiple 屬性。
- 大量文字框:<textarea name="名稱" cols="欄寬" rows="列高">預設值</textarea>
四、接收表單變數
- POST:$_POST['name']
- GET:$_GET['name']
- 兩者都可以:$_REQUEST['name']