總結HTML form表單的一些用法

2020-03-24 17:36:44

字體：大中小

來源：轉載

供稿：網友

HTML form標簽小結

 最近研究 form標簽，有一些小心得寫下來與大家分享分享，共勉。在小結的最后有一個form表單的小例子，可以作為參考。 -----DanlV

form是HTML的一個極為重要的功能標簽之一。

輸入域input

input type屬性有如下屬性值：
1.button按鈕（具體接下來細說）
2.file用于文件選取
3.hidden隱藏域，可以實現隱藏的操作
4.text用于文本輸入
5.password用密碼輸入
6.radio單選按鈕，name屬性相同的為一組
7.checkbox多選按鈕，name屬性相同的為一組
8.image圖片形式提交按鈕
9.reset重置form按鈕
10.submit提交form按鈕

alt屬性，定義當按鈕式圖片時，提片的替代文本

src屬性，定義當按鈕為圖片時，圖片的鏈接地址

checked屬性，定義默認選項 input type= radio name= checked checked的值為true或false，也可以直接寫成checked

disabled屬性，禁用當前輸入域（用法如checked）

readonly屬性，對當前輸入域只讀，實際作用與disabled相同，但是展現出來的效果不一樣（用法如checked）

maxlength屬性，定義輸入域字符的最大長度

name屬性，定義當前的輸入域的名字

html' target='_blank'>value屬性，定義當前輸入域的默認值

文本輸入區textarea

rows屬性，規定可見行數

cols屬性，規定可見列數

disabled屬性，禁用當前文本輸入區

name屬性，當前文本區的名字

readonly屬性，當前文本區域只讀

按鈕button

type類型一共有三種：
1.type= button 普功通功能按鈕
2.type= submit 提交form表單功能按鈕
3.type= reset 重置form表單功相關屬能按鈕

disabled屬性，禁用此按鈕

name屬性，按鈕的名字

value屬性，按鈕上顯示文本內容的默認值

下來菜單select

相關屬性：
1.disabled屬性，禁用該菜單
2.multiple屬性，規定可同時選中多項
3.name屬性，下拉列表的名字
4.size屬性，菜單中可見項目的數目

optgroup 標簽，定義下拉列表的選項分組，屬性為：
5.label屬性，定義選項組的標記（名字），必要屬性
6.disabled屬性，禁用

optinon 屬性，定義下拉列表中的選項（此標簽在 optgroup 標簽）中，屬性為：
1.disabled屬性，禁用
2.label屬性，定義當使用

表單中的標記 label

為了是輸入更為人性化，提高用戶的體驗度，再點擊提示文字的時候光標自動聚焦到輸入的位置，使用此標簽。有兩種使用方法：

label for= user /label inpu t type= text name= user 此方式使用label的for屬性，值制定輸入區域的name

label input type= text name= user /label
將input直接放入label中，不需要使用for屬性，推薦使用。
---

表單中相關元素分組fieldset將表單中相關的元素進行分組，使用 legend 標簽定義分組標題。相關實例見最后的代碼。代碼示例

form action= method= post fieldset legend 天下第一爭霸賽 /legend label 門派： input type= text name= menpai id= /label br label 密碼： input type= password name= psw id= /label br label 上傳你的請柬： input type= file name= qingjian id= /label br 選武器： input type= radio name= arms id= 刀 input type= radio name= arms id= 劍 input type= radio name= arms id= 槍 input type= radio name= arms id= 鞭 br 挑戰對手： input type= checkbox name= Army id= 梅超風 input type= checkbox name= Army id= 洪七 input type= checkbox name= Army id= 金毛獅王謝遜 input type= checkbox name= Army id= 張三豐 br label 選擇你的門派： select name= id= optgroup label= 西域 option value= 天山天山派 /option option value= 昆侖昆侖派 /option /optgroup optgroup label= 中原 option value= 峨眉峨眉派 /option option value= 少林少林派 /option option value= 武當 selected 武當派 /option option value= 天龍天空派 /option option value= 星宿星宿派 /option option value= 逍遙逍遙派 /option option value= 丐幫丐幫派 /option option value= 五毒五毒派 /option option value= 明教明教派 /option /optgroup
br input type= image src= alt= 假裝有圖片 br input type= reset value= 重置 input type= submit value= 確定 /fieldset
獨孤九賤(5)_ThinkPHP5視頻教程

ThinkPHP是國內最流行的中文PHP開發框架,也是您Web項目的最佳選擇。《VeVb.com獨孤九賤(5)－ThinkPHP5視頻教程》課程以ThinkPHP5最新版本為例，從最基本的框架常識開始，將...