html <input> 標簽設置了用戶可以在其中輸入數據的輸入字段
<input> 元素在 <form> 元素中使用,用來聲明允許用戶輸入數據的 input 控件
輸入字段可通過多種方式改變,取決于 type 屬性
<input> 元素是空的,它只包含標簽屬性
可以使用 <label> 元素來定義 <input> 元素的標注
屬性
屬性
|
值
|
描述
|
accept
|
audio/ * video/ * image/ * MIME_type
|
設置通過文件上傳來提交的文件的類型,只針對type="file"
|
align
|
left right top middle bottom
|
html5 已廢棄,不贊成使用 設置圖像輸入的對齊方式,只針對 type="image"
|
alt
|
text
|
定義圖像輸入的替代文本,只針對type="image"
|
autocomplete
|
on off
|
autocomplete 屬性設置 <input> 元素輸入字段是否應該啟用自動完成功能
|
autofocus
|
autofocus
|
屬性設置當頁面加載時 <input> 元素應該自動獲得焦點
|
checked
|
checked
|
checked 屬性設置在頁面加載時應該被預先選定的 <input> 元素。 (只針對 type="checkBox" 或者 type="radio")
|
disabled
|
disabled
|
disabled 屬性設置應該禁用的 <input> 元素
|
form
|
form_id
|
form 屬性設置 <input> 元素所屬的一個或多個表單
|
formaction
|
URL
|
屬性設置當表單提交時處理輸入控件的文件的 URL。(只針對 type="submit" 和 type="image")
|
formenctype
|
application/x-www-form-urlencoded multipart/form-data text/plain
|
屬性設置當表單數據提交到服務器時如何編碼(只適合 type="submit" 和 type="image")
|
formmethod
|
get post
|
定義發送表單數據到 action URL 的 HTTP 方法。 (只適合 type="submit" 和 type="image")
|
formnovalidate
|
formnovalidate
|
formnovalidate 屬性覆蓋 <form> 元素的 novalidate 屬性
|
formtarget
|
_blank _self _parent _top framename
|
設置表示提交表單后在哪里顯示接收到響應的名稱或關鍵詞。(只適合 type="submit" 和 type="image")
|
height
|
pixels
|
設置 <input>元素的高度。(只針對type="image")
|
list
|
datalist_id
|
屬性引用 <datalist> 元素,其中包含 <input> 元素的預定義選項
|
max
|
number
date
|
屬性設置 <input> 元素的最大值
|
maxlength
|
number
|
屬性設置 <input> 元素中允許的最大字符數
|
min
|
number
date
|
屬性設置 <input>元素的最小值
|
multiple
|
multiple
|
屬性設置允許用戶輸入到 <input> 元素的多個值
|
name
|
text
|
name 屬性設置 <input> 元素的名稱
|
pattern
|
regexp
|
pattern 屬性設置用于驗證 <input> 元素的值的正則表達式
|
placeholder
|
text
|
placeholder 屬性設置可描述輸入 <input> 字段預期值的簡短的提示信息
|
readonly
|
readonly
|
readonly 屬性設置輸入字段是只讀的
|
required
|
required
|
屬性設置必需在提交表單之前填寫輸入字段
|
size
|
number
|
size 屬性設置以字符數計的 <input> 元素的可見寬度
|
src
|
URL
|
src 屬性設置顯示為提交按鈕的圖像的 URL 只針對 type="image"
|
step
|
number
|
step 屬性設置 <input> 元素的合法數字間隔
|
type
|
button checkBox color date datetime datetime-local email file hidden image month number password radio range reset search submit tel text time url week
|
type 屬性設置要顯示的 <input> 元素的類型
|
value
|
text
|
指定 <input> 元素 value 的值
|
width
|
pixels
|
width 屬性設置 <input> 元素的寬度 只針對 type="image"
|
范例
一個簡單的 HTML 表單,包含兩個文本輸入框和一個提交按鈕
<form action="/dy/html/getpost">
First name: <input type="text" name="fname"><br>
Last name:
<input type="text" name="lname"><br>
<input type="submit" value="提交">
</form>
HTML 4.01 與 HTML5之間的差異
HTML 4.01 中,"align" 屬性已經不再使用
HTML5 中不支持該屬性,可以使用 css 來定義 <input> 元素的對齊方式
HTML5 中,<input> 添加了幾個屬性,并且添加了對應的值
HTML 與 XHTML 之間的差異
HTML 中,<input> 標簽沒有結束標簽
XHTML 中,<input> 標簽必須被正確地關閉
全局屬性
<input> 標簽支持全局屬性,查看完整屬性表 HTML全局屬性
事件屬性
<input> 標簽支持所有 HTML事件屬性
|