html5中新的表單輸入類型有：1、email類型；2、url類型；3、number類型；4、range類型；5、日期選擇器類型（date、month、week、time等）；6、search類型；7、color類型；8、tel類型。

創(chuàng)新互聯(lián)建站服務項目包括陜西網(wǎng)站建設、陜西網(wǎng)站制作、陜西網(wǎng)頁制作以及陜西網(wǎng)絡營銷策劃等。多年來，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術(shù)優(yōu)勢、行業(yè)經(jīng)驗、深度合作伙伴關(guān)系等，向廣大中小型企業(yè)、政府機構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案，陜西網(wǎng)站推廣取得了明顯的社會效益與經(jīng)濟效益。目前，我們服務的客戶以成都為中心已經(jīng)輻射到陜西省份的部分城市，未來相信會繼續(xù)擴大服務區(qū)域并繼續(xù)獲得客戶的支持與信任！

本教程操作環(huán)境：windows7系統(tǒng)、HTML5版、Dell G3電腦。

HTML表單用于收集不同類型的用戶輸入，在HTML表單中 元素是最重要的表單元素。 元素有很多形態(tài)，根據(jù)不同的 type 屬性，在原HTML表單中type類型有text、password、radio、submit等等，在新的HTML5中擁有多個新的表單輸入類型。這些新特性提供了更好的輸入控制和驗證。

本文將介紹以下幾種新的輸入類型：

emailurlnumberrangeDate pickers（date，month，week，time，datetime，datetime-local）searchcolortelemail類型

當?shù)膖ype屬性設置為email，在提交表單時，會自動驗證email域的值是否符合email的標準格式，再也不用自己用正則表達式去寫email的格式驗證了。

示例

Email：<input type="email" name="useremail" />url類型

當?shù)膖ype屬性設置為url，在提交表單時，會自動驗證url域的值是否符合url的標準格式。

示例

Linkpage:<input type="url" name="link_url" />number類型

當?shù)膖ype屬性設置為number時，會自動檢驗輸入內(nèi)容是否為數(shù)字類型，您還能夠設定該輸入框數(shù)字的限定。

示例

Number：<input type="number" name="user_num" min="1" max="10" />

用于數(shù)字限定的屬性：

屬性描述max規(guī)定允許的值min規(guī)定允許的最小值step規(guī)定合法的數(shù)字間隔（如果 step=“3”，則合法的數(shù)是 -3,0,3,6 等）value規(guī)定默認值disabled規(guī)定輸入字段是禁用的maxlength規(guī)定輸入字段的字符長度pattern規(guī)定用于驗證輸入字段的模式readonly規(guī)定輸入字段的值無法修改required規(guī)定輸入字段的值是必須的size規(guī)定輸入字段的可見字符range類型

range 類型用于應該包含一定范圍內(nèi)數(shù)字值的輸入域。range 類型顯示為滑動條。您還能夠設定對所接受的數(shù)字的限定。

示例

<input type="range" name="user_range" min="1" max="10" />

其用于數(shù)字限定的屬性同number類型前四個。

Date Pickers 日期選擇器類型

用于選取日期和時間。

示例

Date：<input type="date" name="user_date" />

用于選取日期和時間的輸入類型：

date 選取日、月、年month 選取月、年week 選取周和年time 選取時間（小時和分鐘）datetime 選取時間、日、月、年（UTC時間，有時區(qū)）datetime-local 選取時間、日、月、年（本地時間）search類型

用于搜索字段，比如站點搜索或 Google 搜索（搜索字段的表現(xiàn)類似常規(guī)文本字段）。

示例

Search Google:<input type="search" name="googlesearch">color類型

當?shù)膖ype屬性設置為color，會自動檢驗輸入內(nèi)容是否為顏色格式。

示例

Select your favorite color:<input type="color" name="favcolor">tel類型

當?shù)膖ype屬性設置為tel，會自動檢驗輸入內(nèi)容是否為電話號碼格式。

示例

Telephone:<input type="tel" name="usrtel">

相關(guān)推薦：《html視頻教程》

本文名稱：html5中新的表單輸入類型是什么
瀏覽地址：http://chinadenli.net/article30/cjegpo.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供服務器托管、網(wǎng)站導航、做網(wǎng)站、建站公司、電子商務、品牌網(wǎng)站建設

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)