HTML5的表單中type類型相關知識

這篇文章運用簡單易懂的例子給大家介紹HTML5的表單中type類型相關知識，代碼非常詳細，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。

 1.button：定義可點擊的按鈕（通常與 JavaScript 一起使用來啟動腳本）。<br />

<input id="" type="button" name="" value="按鈕" /><br />
<br />

2.checkbox：定義復選框。<br />

<input id="" type="checkbox" name="" />男<br />
<input id="" type="checkbox" name="" checked="checked" />女<br />
<br />

3.cancel：取消按鈕，用于取消submit的提交。<br />

<input id="" type="cancel" name="" /><br />
<br />

4.color：定義拾色器。<br />

<input id="" type="color" name="" /><br />
<br />

5.date：定義 date 控件（包括年、月、日，不包括時間）。<br />

<input id="" type="date" name="" /><br />
<br />

6.datetime：定義 date 和 time 控件（包括年、月、日、時、分、秒、幾分之一秒，基于 UTC 時區）。</p>

<
for
m 
action
="">生日 (日期和時間):<input id="" type="datetime" name="" /> <input id="" type="submit" name="" value="提交" /></form>
<p><br />
<br />

7.datetime-local：定義 date 和 time 控件（包括年、月、日、時、分、秒、幾分之一秒，不帶時區）。<br />

<input id="" type="datetime-local" name="" /><br />
<br />

8.month：定義 month 和 year 控件（不帶時區）。<br />

<input id="" type="month" name="" /><br />
<br />

9.week：定義 week 和 year 控件（不帶時區）。<br />

<input id="" type="week" name="" /><br />
<br />

10.time：定義用于輸入時間的控件（不帶時區）。<br />

<input id="" type="time" name="" /><br />
<br />

11.email：定義用于 e-mail 地址的字段。</p>

<form action=""></form>
<p>E-mail:<input id="" type="email" name="" /><br />
<br />

12.file：定義文件選擇字段和 "瀏覽..." 按鈕，供文件上傳。<br />

<input id="" type="file" name="" /><br />
<br />

13.hidden：定義隱藏輸入字段。<br />

<input id="" type="hidden" name="" /><br />
<br />

14.image：定義圖像作為提交按鈕。<br />

<input id="" type="image" name="" /><br />
<br />

15.number：定義用于輸入數字的字段。<br />

<input id="" type="number" name="" /><br />
<br />

16.password：定義密碼字段（字段中的字符會被遮蔽）。<br />

<input id="" type="password" name="" /><br />
<br />

17.radio：定義單選按鈕。<br />

<input id="" type="radio" name="" />男<br />
<input id="" type="radio" name="" checked="checked" />女<br />
<br />

18.range：定義用于精確值不重要的輸入數字的控件（比如 slider 控件）。<br />

<input id="" type="range" name="" /><br />
<br />

19.reset：定義重置按鈕（重置所有的表單值為默認值）。<br />

<input id="" type="reset" name="" /><br />
<br />

20.search：定義用于輸入搜索字符串的文本字段。<br />

<input id="" type="search" name="" /><br />
<br />

21.submit：定義提交按鈕。<br />

<input id="" type="submit" name="" value="提交" /><br />
<br />

22.tel：定義用于輸入電話號碼的字段。<br />
輸入電話：

<input id="" type="tel" name="" /><br />
<br />

23.text：默認。定義一個單行的文本字段（默認寬度為 20 個字符）。<br />

<input id="" type="text" name="" /><br />
<br />

24.url：定義用于輸入 URL 的字段。<br />
添加你的主頁網址：

<input id="" type="url" name="" /></p>

關于HTML5的表單中type類型相關知識就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。