HTML5新增類型是什么

這篇文章主要介紹HTML5新增類型是什么，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

新增類型：color、date、datetime、email、month、number、tel、time、url、week等；新增屬性：autofocus、form、max、min、pattern、step、list等。

HTML5中新增的input類型及其屬性

HTML4.01中，input的類型只有text、button、password、submit、radio、checkbox和hidden（隱藏域）。H5中新增了一些類型，使用起來更加方便，包括：

• color

點擊時彈出顏色選擇器，可以選擇任意顏色

• number
  輸入范圍內的數字，可以手動輸入超出范圍的數字，但不能提交

• tel
  輸入電話號碼，只有safari支持

• email
  自帶檢測功能，提交時會檢測是否包含@符，并且@符前后是否有字符

• range
  

• url
  輸入的網址必須是http://開頭，并且后面必須有字符，否則不能提交

• date
  可以手動選擇日期
  

• time
  可以手動選擇時間
  

• datetime
  選擇帶有時區的日期和時間，ie，firfox和chrome都不支持

• datetime-local
  
  選擇日期和時間，沒有時區

• month
  
  和date類型一樣，只不過只能選擇到月份

• week
  
  只能選擇到第幾周，這種日期方式國內基本很少用

• search

  定義用于輸入搜索字符串的文本字段
  

新增的一些常用屬性：

• autocomplete
  可選值on/off，表示基于之前用戶輸入的內容瀏覽器自動填寫/不允許自動填寫

• autofocus
  頁面加載時input自動獲取焦點

• form
  規定form之外的input屬于一個或多個表單，form屬性指向歸屬表單的id值，如果屬于多個表單，id之間加空格

• list

list指向引用的datalist（功能和select一樣，但是不在網頁中顯示）預定義的可選項，例如

<form><input list="mylist"/><datalist id="mylist">
    <option>張三</option>
    <option>李四</option>
    <option>王五</option></datalist></form>

而頁面中的表現則是（點擊右側展開時可選項才會展開）：

- formaction

規定當表單提交時處理輸入控件的文件的 URL。(只針對 type="submit" 和 type="image")

- formenctype

規定當表單數據提交到服務器時如何編碼(只適合 type="submit" 和 type="image")。

- formmethod

定義發送表單數據到 action URL 的 HTTP 方法。 (只適合 type="submit" 和 type="image")

- formnovalidate

formnovalidate 屬性覆蓋 <form> 元素的 novalidate 屬性。

- formtarget

規定表示提交表單后在哪里顯示接收到響應的名稱或關鍵詞。(只適合 type="submit" 和 type="image")

- height

規定 <input>元素的高度。(只針對type="image")

- min
規定輸入的最小值，適用于number、range、date、datetime、datetime-local、month、time

- max
規定輸入的最大值，同樣適用于number、range、date、datetime、datetime-local、month、time

- multiple
允許多多個值，用“,”隔開

- required
必須填寫項，即不能為空，為空不提交

- pattern

定義驗證相關的正則，注意格式不需要加“/ /”

- placeholder
定義在用戶輸入之前顯示在輸入框中的提示性內容，一般是淺灰色

- step
定義數字變化的步長，即每次變動的單位，比如step=”5”,如果輸入不是5的整數倍則會在提交時提示格式不正確

- width

width 屬性規定 <input> 元素的寬度。 (只針對type="image")

以上是“HTML5新增類型是什么”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！