下面來看**
placeholder
placeholder : 提示文字,提示佔位autofocus
autofocus : 自動獲取焦點autocomplete
autocomplete: 自動完成: on 開啟 off 關閉required1.必須成功提交過 : 提交過才會記錄
2.當前autocomplete的元素必須有 name 屬性
required : 必須輸入,如果沒有輸入,則會阻止當前資料提交pattern
pattern:正規表示式驗證multiple
multiple : 可以選擇多個檔案 在type為file時form(有用重點)multiple : 在email中,允許輸入多個郵箱位址,以逗號分開
form指定表單id,那麼在將來指定id號的表單進行資料提交的時候,也會將當前表單元素一起提交
<
!doctype html>
"en"
>
"utf-8"
>
title<
/title>
<
/head>
"" id=
"myform"
>
<
!-- placeholder : 提示文字,提示佔位--
>
<
!-- autofocus : 自動獲取焦點--
>
<
!-- autocomplete: 自動完成: on 開啟 off 關閉
1.必須成功提交過 : 提交過才會記錄
2.當前autocomplete的元素必須有 name 屬性--
>
使用者名稱:
"text" placeholder=
"請輸入使用者名稱" autofocus
autocomplete=
"on" name=
"username"
>
<
!-- tel並不會實現驗證,僅僅是在移動端彈出數字鍵盤--
>
<
!-- required : 必須輸入,如果沒有輸入,則會阻止當前資料提交--
>
<
!-- pattern:正規表示式驗證
*: 代表任意個
?: 代表0或1個
+: 代表1或多個
|: 轉譯元字元--
>
手機號:
"tel" name=
"userphone" required pattern=
"^(\+86)?1\d$"
>
<
!-- multiple : 可以選擇多個檔案--
>
檔案:"file" name=
"photo"
>
<
!-- multiple : 在email中,允許輸入多個郵箱位址,以逗號分開--
>
郵箱:"email" name=
"email" multiple>
<
!-- 提交: 可以在瀏覽器的network中檢視提交的東西--
>
"submit" multiple>
<
/form>
<
!-- 下面這個表單元素並沒有包含在form中,預設情況下面的表單資料並不會進行提交--
>
<
!-- form指定表單id,那麼在將來指定id號的表單進行資料提交的時候,也會將當前表單元素一起提交--
>
位址:"text" name=
"address" form=
"myform"
>
<
/body>
<
/html>
Html5中的表單新增屬性
name 標識表單提交時的key值 min 輸入框中的最小值 max 輸入框中的最大值 step 增加 減小的步長 文字框會自動校驗是否符合郵箱的正規表示式 效果圖 顯示數字的範圍框 在h5中,不用增加外掛程式,就能實現日曆的功能,當前只有谷歌提供了原生的日曆 屬性值 week 周 date 日期 ...
HTML5新增表單的property屬性
html5中新增表單的property多用於表單驗證 validity物件上面有8個屬性值 通過下面的invalid可以檢視驗證是否通過,如果八種驗證都通過返回true,一種驗證失敗返回false 首先要給元素節點新增事件監聽 node.addeventlistener invalid fn1,fa...
HTML5新增input表單的屬性
html5新增input表單的屬性 input表單屬性 required required 此處內容不能為空,必填 placeholder 請輸入使用者名稱 方框空裡的灰色 提示語 請輸入使用者名稱 為提示語舉例 autofocus autofocus 網頁載入出來後,游標自動聚焦到需要輸入的框裡 ...