HTML 5 <input> 標(biāo)簽
定義和用法
<input> 標(biāo)簽定義輸入字段,用戶可在其中輸入數(shù)據(jù)。
HTML 4.01 與 HTML 5 之間的差異
在 HTML 5 中,該元素有很多新屬性,同時(shí)不再支持 HTML 4.01 中的一些屬性。
在 HTML 5 中,type 屬性有很多新的值。
例子
注釋:input 元素是空的,僅包含屬性。
提示:請(qǐng)使用 label 元素為表單控件定義標(biāo)注。
屬性
屬性 | 值 | 描述 | 4 | 5 |
---|---|---|---|---|
accept | list_of_mime_types | 一個(gè)逗號(hào)分隔的 MIME 類型列表,指示文件傳輸?shù)?MIME 類型。注釋:僅可與 type="file" 配合使用。 | 4 | 5 |
align |
|
定義圖像之后的文本對(duì)齊方式。 不支持,請(qǐng)使用 CSS 代替。 |
4 | |
alt | text |
定義圖像的替代文本。 注釋:僅可與 type="image" 配合使用。 |
4 | 5 |
autocomplete | 5 | |||
autofocus |
|
當(dāng)頁(yè)面加載時(shí),使輸入字段獲得焦點(diǎn)。 注釋:type="hidden" 時(shí),無(wú)法使用。 |
5 | |
checked |
|
指示此 input 元素首次加載時(shí)應(yīng)當(dāng)被選中。 注釋:請(qǐng)與 type="checkbox" 及 type="radio" 配合使用。 |
4 | 5 |
disabled |
|
當(dāng) input 元素首次加載時(shí)禁用此元素,這樣用戶就無(wú)法在其中寫文本,或選定它。 注釋:不能與 type="hidden" 一同使用。 |
4 | 5 |
form |
|
定義輸入字段屬于一個(gè)或多個(gè)表單。 | 5 | |
inputmode | inputmode | 定義預(yù)期的輸入類型。 | 5 | |
list | id of a datalist | 引用 datalist 元素。如果定義,則一個(gè)下拉列表可用于向輸入字段插入值。 | 5 | |
max | number | 輸入字段的最大值。 | 5 | |
maxlength | number | 定義文本域中所允許的字符最大數(shù)目。 | 4 | 5 |
min | number | 輸入字段的最小值。 | 5 | |
name | field_name | 為 input 元素定義唯一的名稱。 | 4 | 5 |
pattern | 5 | |||
readonly | readonly | 指示是否可修改該字段的值。 | 4 | 5 |
replace | text | 定義當(dāng)表單提交時(shí)如何處理該輸入字段。 | 5 | |
required |
|
定義輸入字段的值是否是必需的。 當(dāng)使用下列類型時(shí)無(wú)法使用:hidden, image, button, submit, reset |
5 | |
size | number_of_char | 定義 input 元素的大小。不再支持。 | 4 | |
src | URL |
定義要顯示的圖像的 URL。 僅用于 type="image" 時(shí)。 |
4 | 5 |
step | 5 | |||
template | template | 定義一個(gè)或多個(gè)模板。 | 5 | |
type |
|
指示 input 元素的類型。 默認(rèn)值是 "text" 注釋:該屬性不是必需的。但是我們認(rèn)為應(yīng)該使用它。 |
4 | 5 |
value | value |
對(duì)于按鈕、重置按鈕和確認(rèn)按鈕:定義按鈕上的文本。 對(duì)于圖像按鈕:定義傳遞向某個(gè)腳本的此域的符號(hào)結(jié)果。 對(duì)于復(fù)選框和單選按鈕:定義 input 元素被點(diǎn)擊時(shí)的結(jié)果。 對(duì)于隱藏域、密碼域以及文本域:定義元素的默認(rèn)值。 注釋:不能與 type="file" 一同使用。 注釋:與 type="checkbox" 和 type="radio" 一同使用時(shí),此元素是必需的。 |
4 | 5 |
標(biāo)準(zhǔn)屬性
class, contenteditable, contextmenu, dir, draggable, id, irrelevant, lang, ref, registrationmark, tabindex, template, title
如需完整的描述,請(qǐng)?jiān)L問(wèn) HTML 5 中標(biāo)準(zhǔn)屬性。
事件屬性
onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu, ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart, ondrop, onerror, onfocus, onkeydown, onkeypress, onkeyup, onload, onmessage, onmousedown, onmousemove, onmouseover, onmouseout, onmouseup, onmousewheel, onresize, onscroll, onselect, onsubmit, onunload
如需完整的描述,請(qǐng)?jiān)L問(wèn) HTML 5 中事件屬性。
TIY 實(shí)例
- 文本域 (Text fields)
- 本例演示如何在HTML頁(yè)面創(chuàng)建文本域。用戶可以在文本域?qū)懭胛谋尽?/dd>
- 密碼域
- 本例演示如何創(chuàng)建 HTML 的密碼域。
- 復(fù)選框
- 本例演示如何在 HTML 頁(yè)中創(chuàng)建文本框。用戶可以選中或取消選取復(fù)選框。
- 單選按鈕
- 本例演示如何在 HTML 中創(chuàng)建單選按鈕。
- 創(chuàng)建按鈕
- 本例演示如何創(chuàng)建按鈕。你可以對(duì)按鈕上的文字進(jìn)行自定義。
- 帶有輸入框和確認(rèn)按鈕的表單
- 本例演示如何向頁(yè)面添加表單。此表單包含兩個(gè)輸入框和一個(gè)確認(rèn)按鈕。
- 帶有復(fù)選框的表單
- 此表單包含兩個(gè)復(fù)選框和一個(gè)確認(rèn)按鈕。
- 帶有單選按鈕的表單
- 此表單包含兩個(gè)單選框和一個(gè)確認(rèn)按鈕。