html_表單

版權聲明：本文為部落客原創文章，轉載請注明出處。 https://blog.csdn.net/twilight_karl/article/details/54647172

用戶端和服務端資訊交流的途徑

form

建立一個表單，容器，表單元素必須在form種才能起作用。

action: 規定當送出表單時，向何處發送表單資料。action=URL(傳遞目标，處理表單資訊的伺服器端應用程式)

method: 規定如何發送表單資料(POST/GET)

name: 規定表單的名稱。

target: _blank/_parent/_self/_top/framename 規定在何處打開 action URL。

post 傳遞大量資訊

get将值附加在URL後适合傳遞少量資訊

input

定義輸入域，使用者可在其中輸入資料。

type和name屬性是必須的，其他屬性是可選的（所有表單元素都是這樣）

沒有結束标簽

單行文本框

input name=’text’

value=’初始值’

size=’顯示字元數’

maxlength=’最多容納字元數’

readonly=’readonly’隻能讀，不可修改

disabled=’disabled’不可操作

密碼框

input type=’password’ value=’初始值’ size=’顯示字元數’

與文本框類似

單選框

input type=’radio’

value 單選框的值

name 名稱，不同的選項名稱必須相同

checked 預設選中(checked=’checked’)

下拉框

<select name=’下拉框名稱’>

<option selected=’selected’ value=’項目的值’>清單顯示的值</option>

</select>

下拉分組: <optgroup label=’分組名稱’></optgroup>

size 顯示的行數

multiple是否允許多選

 籍貫：
  <select size='3' multiple='multiple'>
    <option>合肥</option>
    <option>南京</option>
    <option>合肥</option>
    <option>南京</option>
  </select>                

多選框

input type=”checkbox” name=”Car”

value 項目的值

name必須相同

檔案上傳

input type=’file’

按鈕

input type=’submit’ 送出

input type=’reset’重置(清空所有輸入的内容)

input type=’button’普通按鈕

 <input type='submit' value='送出2'>
    <input type='reset' value='重置2'>
    <input type='button'value='普通按鈕'>                

文本域

<textarea>… </textarea>

cols =’每行顯示的字元數’

rows =’每列顯示的字元數’

 <textarea cols='15' rows='6'> </textarea>                

隐藏域

input type=’hidden’

看不見的元件

表單外框

fieldset 定義圍繞在表單周圍的邊框

legend 标題

 <fieldset>
        <legend>性别</legend>
        <label for='man'>男</label>
        <input type='radio' value='man' id='man' name='sex'>
        <label for='women'>女</label>
        <input type='radio' value='women' id='women' name='sex'>
    </fieldset>                

标注内容

label 元素不會向使用者呈現任何特殊效果。不過，它為滑鼠使用者改進了可用性。如果您在 label 元素内點選文本，就會觸發此控件。就是說，當使用者選擇該标簽時，浏覽器就會自動将焦點轉到和标簽相關的表單控件上。 label标簽的 for 屬性應當與相關元素的 id 屬性相同。

 性别:
    <label for='man'>男</label>
  <input type='radio' value='man' name='sex' id='man' checked='checked'>
    <label for='women'>女</label>
  <input type='radio' value='women' name='sex' id='women' >