1、form屬性
表單內的從屬元素,可以寫在表單外部。可以通過指定元素的form屬性來宣告元素所屬表單。form的屬性值為表單的id。
1
<
form
id="testform"
>
2<
input
type
="text"
>
3form
>
4<
textarea
form
="testform"
>
textarea
>
詳細學習內容可參看:html5新增的form屬性簡介
2、formaction屬性
給所有的提交按鈕增加formaction屬性,可以通過不同的按鈕將表單提交到不同的頁面。
1
<
form
id="testform"
action
="serve.jsp"
>
2<
input
type
="submit"
name
="s1"
value
="v1"
formaciton
="s1.jsp"
>
提交到s1
3<
input
type
="submit"
name
="s2"
value
="v2"
formaciton
="s2.jsp"
>
提交到s2
4<
input
type
="submit"
>
5form
>
瀏覽器支援:internet explorer 10, firefox, opera, chrome, 和 safari 支援 formaction 屬性。
3、formmethod屬性
formmethod 屬性定義傳送表單資料到 action url 的 http 方法。
<
form
id="testform"
action
="serve.jsp"
>
<
input
type
="submit"
name
="s1"
value
="v1"
formaciton
="s1.jsp"
formmethod
="post"
>
提交到s1
<
input
type
="submit"
name
="s2"
value
="v2"
formaciton
="s2.jsp"
formmethod
="get"
>
提交到s2
form
>
4、placeholder屬性
用於未輸入文字框顯示輸入提示。
1
<
input
type
="text"
placeholder
="請輸入使用者名稱"
>
5、autofocus屬性
給文字框、選擇框或者按鈕新增autofocus屬性,可在頁面開啟時自動獲得游標焦點。乙個頁面上只能有乙個具有autofocus屬性的控制項。
1
<
input
type
="text"
autoforcus
>
瀏覽器支援:internet explorer 10、firefox、opera、chrome 和 safari 支援 autofocus 屬性。
6、list屬性
為單行文字框特有屬性,配合datalist標籤使用。屬性值為datalist標籤的id。
1 text:<
input
type
="text"
list
="testlist"
>
2<
datalist
id="testlist"
style
="display:none;"
>
3<
option
value
="good morning"
>good morning
option
>
4<
option
value
="hello"
>hello
option
>
5<
option
value
="good afternoon"
>good afternoon
option
>
6datalist
>
瀏覽器支援:internet explorer 10、firefox、opera 和 chrome 支援 list 屬性。
7、autocomplete屬性
規定輸入字段是否應該啟用自動完成功能。自動完成允許瀏覽器**對字段的輸入。當使用者在字段開始鍵入時,瀏覽器基於之前鍵入過的值,應該顯示出在字段中填寫的選項。
text:<
input
type
="text"
name
="textinput"
list
="testlist"
placeholder
="輸入一句英文問候語"
autocomplete
="on"
>
<
datalist
id="testlist"
style
="display:none;"
>
<
option
value
="good morning"
>good morning
option
>
<
option
value
="hello"
>hello
option
>
<
option
value
="good afternoon"
>good afternoon
option
>
datalist
>
詳細學習內容可參看:html5 autocomplete屬性、表單自動完成
8、input的新增type屬性種類
值
描述
url定義用於輸入 url 的字段。
time
定義用於輸入時間的控制項(不帶時區)。
search
定義用於輸入搜尋字串的文字字段。
number
定義用於輸入數字的字段。
定義用於 e-mail 位址的字段。
date
定義 date 控制項(包括年、月、日,不包括時間)。
datetime
定義 date 和 time 控制項(包括年、月、日、時、分、秒、幾分之一秒,基於 utc 時區)。
datetime-local
定義 date 和 time 控制項(包括年、月、日、時、分、秒、幾分之一秒,不帶時區)。
month
定義 month 和 year 控制項(不帶時區)。
week
定義 week 和 year 控制項(不帶時區)。
range
定義用於精確值不重要的輸入數字的控制項(比如 slider 控制項)。
tel定義用於輸入**號碼的字段。
color
定義拾色器。
詳細學習內容可參看:html type 屬性
更多專業前端知識,請上
【猿2048】www.mk2048.com
HTML5新增屬性
html5的input標籤新增了很多屬性,也是讓大家非常興奮的一件事,用簡單的乙個屬性搞定以前複雜的js驗證。input新增的這些屬性,使得html和js的分工更明確了,使用起來十分舒暢。size medium 新增屬性一 size autoconmplete autoconmplete可以賦值為 ...
HTML5新增的屬性列表
序號 屬性型別 新增屬性 屬性說明與表 單的相關 屬性對 type text 與 指定autofocus屬性 以指定屬性的方式讓元素在頁面開啟時自動獲取焦點 對 type text 與 指定placeholder屬性 對使用者輸入進行提示,提示使用者可以輸入的內容 對與指定 form屬性 宣告屬於哪...
HTML5新增屬性詳細講解
新增的input type屬性值 1.email,使用方法 輸入郵箱格式 2.tel,使用方法 輸入手機號碼格式 3.urll,使用方法 輸入url格式 4.numberl,使用方法 輸入數字格式 5.search,使用方法 搜尋框 體現語義化 6。range,使用方法 自由拖動滑塊 7.time,...