通過代碼示例跟我學(xué)html5相關(guān)技術(shù)——html5中的表單標(biāo)簽及新特性第1部分-文庫(kù)吧資料
2024-11-22 07:40本頁(yè)面
【正文】 置為 0，只需在 range標(biāo)簽中添加相應(yīng)的 value 屬性即可，如下所示： input type=range name=rating id=rating min=0 max=25 step=5 value=0 （ 4）應(yīng)用 JavaScript 腳本動(dòng)態(tài) 顯示所選中的值 可以使用 HTML5 output標(biāo)簽和一些非常簡(jiǎn)單的 JavaScript 即可實(shí)現(xiàn)顯示用戶選擇的值，移動(dòng)該滑動(dòng)條。如下圖所示： （ 3）可以精確設(shè)置和定義 但由于“ range”類型的標(biāo)簽的輸入類型是非常粗放的，一般可以通過添加其它的屬性進(jìn)行進(jìn)一步的精確設(shè)置。 （ 3）示例執(zhí)行的結(jié)果 在 Chrome 瀏覽器下 的顯示 效果 如下左圖所示，而在 Opera 瀏覽器 中的顯示效果如下右圖所示 ： range （ 1）主要的功能 其顯示的效果為滑動(dòng)條或拖動(dòng)條等形式，目前在 opera、 safari 和谷歌的瀏覽器中支持，但顯示的形式和風(fēng)格都存在很大的不同。 （ 2）應(yīng)用示例 form action= method= enctype= input type=number min=0 step= name=nmb value=11 /form 其中的 min、 max、 step 等屬性分別限制 input 輸入框內(nèi)的數(shù)值最小值、最大值、和點(diǎn)擊上下箭頭時(shí)的變化 值。也就是要求輸入格式正確的 URL地址 ,而在 Opera 瀏覽器中還會(huì)自動(dòng)在所輸入的 URL 地址開始處添加 （ 2）應(yīng)用示例 tel （ 1）主要的功能 電話號(hào)碼，但實(shí)際上它并沒有提供對(duì)電話號(hào)碼的格式驗(yàn)證功能 ,與普通的文本輸入框組件（ type=text類型 ） 在使用方面基本相同。 （ 3）示例的執(zhí)行結(jié)果截圖 楊教授工作室 精心創(chuàng)作的優(yōu)秀程序員 職業(yè)提升必讀系列資料 楊教授工作室，版權(quán)所有，盜版必究 ， 11/16 頁(yè) 11 （ 4）允許輸入多個(gè) Email 地址信息 通過應(yīng)用 multiple 屬性，可以為 標(biāo)簽添加多個(gè) Email 地址信息，因?yàn)樵谀J(rèn)狀態(tài)下只能輸入一個(gè) Email 地址信息字符串。 （ 1）主要的功能 帶有郵箱格式驗(yàn)證的 控件 —— 當(dāng)提交表單時(shí)若輸入的內(nèi)容不是郵箱地址類型的內(nèi)容，瀏覽器是不允許提交的，同時(shí)也還會(huì)自動(dòng)報(bào)錯(cuò)（在 opera 瀏覽器中支持） —— 該控件會(huì)自動(dòng)地對(duì)操作者所輸入的 字段的值進(jìn)行格式驗(yàn)證。 time HH:MM or HH:MM: 時(shí)間以 24 小時(shí)制表示，可選擇帶有秒和毫秒。 month YYYYMM 分別表示年（ 4位數(shù)字）和月（ 2 位數(shù)字），以連字符分開。左欄給出的第二個(gè)范例表示太平洋夏時(shí)制時(shí)間（ Pacific Daylight Time）的時(shí)差（滯后 UTC7 個(gè)小時(shí)）。 日期的表示格式與 date 相同，楊教授工作室 精心創(chuàng)作的優(yōu)秀程序員 職業(yè)提升必讀系列資料 楊教授工作室，版權(quán)所有，盜版必究 ， 10/16 頁(yè) 10 :00 其后面跟著一個(gè)字母 T，時(shí)間以 24小時(shí)制表示，可選擇帶有與 UTC 的本 地時(shí)差。 charset=utf8 / titleHTML5 中表示時(shí)間的表單控件標(biāo)簽 /title /head body dateinput type=date /br / datetimeinput type=datetime value=10:20/br / datetimelocalinput type=datetimelocal value=/br / timeinput type=time value=/br / weekinput type=week value=/br / monthinput type=month value=/br / input type=number min=0 step= name=nmb value=11br / /body /html （ 3）示例執(zhí)行的結(jié)果截圖 HTML5 支持的日期和時(shí)間相關(guān)的輸入類型 類型 格式 描述 date YYYYMMDD 分別表示年（ 4位數(shù)字）、月（ 2 位數(shù)字） 和日（ 2 位數(shù)字），每個(gè)數(shù)值以連字符分開。 （ 2） 應(yīng)用示例 楊教授工作室 精心創(chuàng)作的優(yōu)秀程序員 職業(yè)提升必讀系列資料 楊教授工作室，版權(quán)所有，盜版必究 ， 9/
畢業(yè)設(shè)計(jì)相關(guān)推薦
鄂ICP備17016276號(hào)-1