輸入限制
disabled
規(guī)定輸入字段應(yīng)該被禁用尉共。被禁用的元素是不可用和不可點擊的。被禁用的元素不會被提交
max
規(guī)定輸入字段的最大值捧存。
maxlength
規(guī)定輸入字段的最大字符數(shù)粪躬。
min
規(guī)定輸入字段的最小值。
pattern
規(guī)定通過其檢查輸入值的正則表達(dá)式昔穴。
readonly
規(guī)定輸入字段為只讀(無法修改)镰官。
required
規(guī)定輸入字段是必需的(必需填寫)。
size
規(guī)定輸入字段的寬度(以字符計)吗货,體現(xiàn)為文本框的寬度泳唠。
step
規(guī)定輸入字段的合法數(shù)字間隔。
value
規(guī)定輸入字段的默認(rèn)值宙搬。
<body>
<form action="">
First name:<br>
<input type="text" name="firstname" value ="John" readonly>
</form>
<br>
<form action="">
First name:<br>
<input type="text" name="firstname" value ="Haha" disabled>
</form>
</body>
運行:HTML5 屬性
HTML5 為 <input> 增加了如下屬性:
autocomplete 屬性
autocomplete 屬性規(guī)定表單或輸入字段是否應(yīng)該自動完成笨腥。
當(dāng)自動完成開啟,瀏覽器會基于用戶之前的輸入值自動填寫值勇垛。
提示:您可以把表單的 autocomplete 設(shè)置為 on脖母,同時把特定的輸入字段設(shè)置為 off,反之亦然闲孤。
autocomplete 屬性適用于 <form> 以及如下 <input> 類型:text谆级、search、url讼积、tel肥照、email、password勤众、datepickers建峭、range 以及 color。
<body>
<form action="/example/html5/demo_form.asp" method="get" autocomplete="on">
First name:<input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
E-mail: <input type="email" name="email" autocomplete="off" /><br />
<input type="submit" />
</form>
<p>填寫并提交表單决摧,然后重新加載該頁面亿蒸,看看自動完成功能是如何工作的凑兰。</p>
<p>注意,表單的自動完成功能是打開的边锁,但是 e-mail 字段的自動完成功能是關(guān)閉的姑食。</p>
</body>
novalidate 屬性
novalidate 屬性屬于 <form> 屬性。
如果設(shè)置茅坛,則 novalidate 規(guī)定在提交表單時不對表單數(shù)據(jù)進(jìn)行驗證音半。
autofocus 屬性
autofocus 屬性是布爾屬性。
如果設(shè)置贡蓖,則規(guī)定當(dāng)頁面加載時 <input> 元素應(yīng)該自動獲得焦點曹鸠。
form 屬性
form 屬性規(guī)定 <input> 元素所屬的一個或多個表單。
提示:如需引用一個以上的表單斥铺,請使用空格分隔的表單 id 列表彻桃。
<body>
<form action="/example/html5/demo_form.asp" method="get" id="form1">
First name: <input type="text" name="fname" /><br />
<input type="submit" value="提交" />
</form>
<p>下面的 "Last name" 字段位于 form 元素之外,但仍然是表單的一部分晾蜘。</p>
Last name: <input type="text" name="lname" form="form1" />
</body>
formaction 屬性
formaction 屬性規(guī)定當(dāng)提交表單時處理該輸入控件的文件的 URL邻眷。
formaction 屬性覆蓋 <form> 元素的 action 屬性。
formaction 屬性適用于 type="submit" 以及 type="image"。
<body>
<form action="/example/html5/demo_form.asp" method="get">
First name: <input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
<input type="submit" value="提交" /><br />
<input type="submit" formaction="/example/html5/demo_admin.asp" value="以管理員身份提交" />
</form>
</body>
formenctype 屬性
formenctype 屬性規(guī)定當(dāng)把表單數(shù)據(jù)(form-data)提交至服務(wù)器時如何對其進(jìn)行編碼(僅針對 method="post" 的表單)。
formenctype 屬性覆蓋 <form> 元素的 enctype 屬性类少。
formenctype 屬性適用于 type="submit" 以及 type="image"。
<body>
<form action="/example/html5/demo_post_enctype.asp" method="post">
First name: <input type="text" name="fname" /><br />
<input type="submit" value="提交" />
<input type="submit" formenctype="multipart/form-data" value="以 Multipart/form-data 編碼提交" />
</form>
</body>
formmethod 屬性
formmethod 屬性定義用以向 action URL 發(fā)送表單數(shù)據(jù)(form-data)的 HTTP 方法键俱。
formmethod 屬性覆蓋 <form> 元素的 method 屬性。
formmethod 屬性適用于 type="submit" 以及 type="image"。
<body>
<form action="/example/html5/demo_form.asp" method="get">
First name: <input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
<input type="submit" value="提交" />
<input type="submit" formmethod="post" formaction="/example/html5/demo_post.asp" value="使用 POST 提交" />
</form>
</body>
formnovalidate 屬性
novalidate 屬性是布爾屬性。
如果設(shè)置板惑,則規(guī)定在提交表單時不對 <input> 元素進(jìn)行驗證。
formnovalidate 屬性覆蓋 <form> 元素的 novalidate 屬性笼蛛。
formnovalidate 屬性可用于 type="submit"洒放。
<body>
<form action="/example/html5/demo_form.asp" method="get">
E-mail: <input type="email" name="userid" /><br />
<input type="submit" value="提交" /><br />
<input type="submit" formnovalidate="formnovalidate" value="進(jìn)行沒有驗證的提交" />
</form>
</body>
formtarget 屬性規(guī)定的名稱或關(guān)鍵詞指示提交表單后在何處顯示接收到的響應(yīng)蛉鹿。
formtarget 屬性會覆蓋 <form> 元素的 target 屬性滨砍。
formtarget 屬性可與 type="submit" 和 type="image" 使用。
<body>
<form action="/example/html5/demo_form.asp" method="get">
First name: <input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
<input type="submit" value="提交" />
<input type="submit" formtarget="_blank" value="提交到新窗口/選項卡" />
</form>
</body>
height 和 width 屬性
height 和 width 屬性規(guī)定 <input> 元素的高度和寬度妖异。
height 和 width 屬性僅用于 <input type="image">惋戏。
注釋:請始終規(guī)定圖像的尺寸。如果瀏覽器不清楚圖像尺寸他膳,則頁面會在圖像加載時閃爍响逢。
list 屬性
list 屬性引用的 <datalist> 元素中包含了 <input> 元素的預(yù)定義選項。
<body>
<input list="cars" />
<datalist id="cars">
<option value="BMW">
<option value="Ford">
<option value="Volvo">
</datalist>
</body>
min 和 max 屬性
min 和 max 屬性規(guī)定 <input> 元素的最小值和最大值棕孙。
min 和 max 屬性適用于如需輸入類型:number舔亭、range些膨、date、datetime钦铺、datetime-local订雾、month、time 以及 week矛洞。
multiple 屬性
multiple 屬性是布爾屬性洼哎。
如果設(shè)置,則規(guī)定允許用戶在 <input> 元素中輸入一個以上的值沼本。
multiple 屬性適用于以下輸入類型:email 和 file噩峦。
<body>
<form action="/example/html5/demo_form.asp" method="get">
選擇圖片:<input type="file" name="img" multiple="multiple" />
<input type="submit" />
</form>
<p>請嘗試在瀏覽文件時選取一個以上的文件。</p>
</body>
pattern 屬性
pattern 屬性規(guī)定用于檢查 <input> 元素值的正則表達(dá)式抽兆。
pattern 屬性適用于以下輸入類型:text识补、search、url郊丛、tel李请、email、and password厉熟。
Country code:
<input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code">
placeholder 屬性
placeholder 屬性規(guī)定用以描述輸入字段預(yù)期值的提示(樣本值或有關(guān)格式的簡短描述)导盅。
該提示會在用戶輸入值之前顯示在輸入字段中。
placeholder 屬性適用于以下輸入類型:text揍瑟、search白翻、url、tel绢片、email 以及 password滤馍。
<body>
<form action="/example/html5/demo_form.asp" method="get">
<input type="search" name="user_search" placeholder="Search W3School" />
<input type="submit" />
</form>
</body>
required 屬性
required 屬性是布爾屬性。
如果設(shè)置底循,則規(guī)定在提交表單之前必須填寫輸入字段巢株。
required 屬性適用于以下輸入類型:text、search熙涤、url阁苞、tel、email祠挫、password那槽、date pickers、number等舔、checkbox骚灸、radio、and file慌植。
用戶名: <input type="text" name="usrname" required>
step 屬性
step 屬性規(guī)定 <input> 元素的合法數(shù)字間隔甚牲。
示例:如果 step="3"义郑,則合法數(shù)字應(yīng)該是 -3、0丈钙、3魔慷、6、等等著恩。
提示:step 屬性可與 max 以及 min 屬性一同使用院尔,來創(chuàng)建合法值的范圍。
step 屬性適用于以下輸入類型:number喉誊、range邀摆、date、datetime伍茄、datetime-local栋盹、month、time 以及 week敷矫。