狀態(tài)標簽
meter:用來顯示已知范圍的標量值或者分數值弥咪。
- value:當前的數值络它。
- min:值域的最小邊界值咖城。如果設置了茬腿,它必須比最大值要小。如果沒設置宜雀,默認為0
- max:值域的上限邊界值切平。如果設置了,它必須比最小值要大辐董。如果沒設置悴品,默認為1
- low:定義了低值區(qū)間的上限值,如果設置了,它必須比最小值屬性大郎哭,并且不能超過high值和最大值他匪。未設置或者比最小值還要小時,其值即為最小值夸研。
- high:定義了高值區(qū)間的下限值邦蜜。如果設置了,它必須小于最大值亥至,同時必須大于low值和最小值悼沈。如果沒有設置,或者比最大值還大姐扮,其值即為最大值絮供。
- optimum:這個屬性用來指示最優(yōu)/最佳取值。
progress:用來顯示一項任務的完成進度
- max:該屬性描述了這個progress元素所表示的任務一共需要完成多少工作.
- value:該屬性用來指定該進度條已完成的工作量.
如果沒有value屬性,則該進度條的進度為"不確定",也就是說,進度條不會顯示任何進度,你無法估計當前的工作會在何時完成
列表標簽
datalist:datalist會包含一組option元素茶敏,這些元素表示其表單控件的可選值
- 它的id必須要和input中的list一致
details: 一個ui小部件壤靶,用戶可以從其中檢索附加信息。
- open屬性來控制附加信息的顯示與隱藏
summary:用作 一個<details>元素的一個內容摘要(標題)
注釋標簽
ruby
- rt: 展示文字注音或字符注釋惊搏。
標記標簽
mark:著重
瘋狂的表單
Html5 Forms概述,在Html5中:
- 表單仍然使用<form>元素作為容器,我們可以在其中設置基本的提交特性
- form的action指向一個服務器地址(接口)
- 當用戶或開發(fā)人員提交頁面時,表單仍然用于向服務端發(fā)送表單中控件的值
- 注意表單項的name屬性必須有值贮乳,服務器才能獲取表單
- 所有之前的表單控件都保持不變
- 仍然可以使用腳本操作表單控件
- Html5之前的表單
標簽為input
- type:text:文本框
- type:password:密碼框
- type:radio:單選按鈕
注意以name分組,確保單選關系恬惯,也為了后臺能成功獲取
必須有value屬性向拆,為了后臺獲取后的識別(不寫統(tǒng)一為on)
checked屬性,選中控制 - type:checkbox:復選框
注意以name分組,確保為一組酪耳,也為了后臺能成功獲取
必須有value屬性浓恳,為了后臺獲取后的識別(不寫統(tǒng)一為on)
checked屬性,選中控制 - type:submit:提交按鈕
- type:reset:重置按鈕
- type:button:普通按鈕
標簽為select:下拉框
- name屬性在select標簽上
- multiple:可選多項
- 子項可以通過optgroup來進行分組
label屬性用來定義組名
-子項為option標簽
-selected屬性,選中控制
-必須有value屬性,為了后臺獲取后的識別
標簽為textarea:文本域
標簽為button:按鈕
- type:submit:提交按鈕
- type:reset:重置按鈕
- type:button:普通按鈕
標簽為lable:控制文本與表單的關系
-for屬性指向一個input的id
標簽fieldset 標簽legend:來為表單分組
- attr & prop
- Html5 新增
新增表單控件
type:email :email地址類型
當格式不符合email格式時,提交是不會成功的,會出現提示颈将;只有當格式相符時梢夯,提交才會通過
在移動端獲焦的時候會切換到英文鍵盤type:tel :電話類型
在移動端獲焦的時候會切換到數字鍵盤type:url :url類型
當格式不符合url格式時,提交是不會成功的吆鹤,會出現提示厨疙;只有當格式相符時,提交才會通過type:search :搜索類型
有清空文本的按鈕type:range : 特定范圍內的數值選擇器
屬性:min疑务、max沾凄、step
- type:number: 只能包含數字的輸入框
- type:color : 顏色選擇器
- type:datetime: 顯示完整日期(移動端瀏覽器支持)
- type:datetime-local: 顯示完整日期,不含時區(qū)
- type:time: 顯示時間知允,不含時區(qū)
- type:date: 顯示日期
- type:week: 顯示周
- type:month: 顯示月
新增表單屬性
placeholder: 輸入框提示信息
適用于form以及type為text,search,url,tel,email,password類型的inputautofocus : 指定表單獲取輸入焦點
required: 此項必填撒蟀,不能為空
pattern: 正則驗證 pattern="\d{1,5}
formaction:在submit里定義提交地址
list和datalist : 為輸入框構造一個選擇列表
list值為datalist標簽的id
表單驗證反饋
validity對象,通過下面的valid可以查看驗證是否通過温鸽,如果八種驗證都通過返回true保屯,一種驗證失敗返回false
node.addEventListener("invalid",fn1,false);
valueMissing : 輸入值為空時返回true
typeMismatch : 控件值與預期類型不匹配返回true
patternMismatch : 輸入值不滿足pattern正則返回true
tooLong: 超過maxLength最大限制返回true
rangeUnderflow: 驗證的range最小值返回true
rangeOverflow: 驗證的range最大值返回true
stepMismatch: 驗證range 的當前值 是否符合min、max及step的規(guī)則返回true
customError 不符合自定義驗證返回true
setCustomValidity
關閉驗證
formnovalidate屬性