日本综合一区二区|亚洲中文天堂综合|日韩欧美自拍一区|男女精品天堂一区|欧美自拍第6页亚洲成人精品一区|亚洲黄色天堂一区二区成人|超碰91偷拍第一页|日韩av夜夜嗨中文字幕|久久蜜综合视频官网|精美人妻一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時(shí)間:8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
詳細(xì)介紹HTML5表單的新功能

HTML5 是下一代 Web 語言,它不單單是一種標(biāo)記語言,更為下一代 Web 提供了全新功能,并將***下一代 Web 實(shí)現(xiàn)類似桌面的應(yīng)用體驗(yàn)。下面介紹HTML5表單的新功能。

專注于為中小企業(yè)提供成都做網(wǎng)站、網(wǎng)站設(shè)計(jì)、外貿(mào)營銷網(wǎng)站建設(shè)服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)雙牌免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動(dòng)了1000+企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。

HTML語言作為如今編程最為廣泛的語言,具有易用、快捷、多瀏覽平臺(tái)兼容等特點(diǎn),但是隨著時(shí)代的進(jìn)步,HTML的標(biāo)準(zhǔn)卻停滯不前,這一次還在不斷開發(fā)中的HTML5標(biāo)準(zhǔn)的更新可以說給這門標(biāo)記語言帶來了新的生命力。

表單是網(wǎng)頁中常見的控件(集)。小到網(wǎng)站注冊登錄,大到一個(gè)企業(yè)的數(shù)據(jù)管理系統(tǒng),都基本上有表單的身影。表單之所以如此重要,主要是因?yàn)樗鼡?dān)負(fù)大量的用戶和網(wǎng)頁后臺(tái)數(shù)據(jù)更新交互的任務(wù)。Web開發(fā)人員,對(duì)于網(wǎng)頁表單可以說又愛又恨,愛的是它方便的收集、組織數(shù)據(jù)的功能,恨的是它的功能很大程度上也就僅此而已。

一些在最終網(wǎng)站用戶看起來稀松平常的功能,比如說輸入類型檢查、表單校驗(yàn)、錯(cuò)誤提示等等,開發(fā)人員無不需要花費(fèi)大量精力利用 JavaScript和DOM編程來滿足這些天然所需的功能點(diǎn),而隨著Ajax的流行,出現(xiàn)的一些JavaScript的工具庫,比如Dojo, YUI等都提供了方便的JavaScript Widget或者API來減輕開發(fā)人員的負(fù)擔(dān)。

HTML5 Web Forms 2.0是對(duì)目前Web表單的全面提升,它在保持了簡便易用的特性的同時(shí),增加了許多內(nèi)置的控件或者控件屬性來滿足用戶的需求,并且同時(shí)減少了開發(fā)人員的編程。HTML5 主要在以下幾個(gè)方面對(duì)目前的Web表單做了改進(jìn):

一、表單結(jié)構(gòu)更自由

XHTML中需要放在form之中的諸如input/button/select/textarea等標(biāo)簽元素,在HTML 5中完全可以放在頁面任何位置,然后通過新增的form屬性指向元素所屬表單的ID值,即可關(guān)聯(lián)起來。

二、新的控件類型

1.email輸入類型:

 
 
 
  1.  

此類型要求輸入格式正確的email地址,否則瀏覽器是不允許提交的,并會(huì)有一個(gè)錯(cuò)誤信息提示.此類型在Opera中必須指定name值,否則無效果.

2.url輸入類型:

 
 
 
  1.  

上面代碼展示的文本域要求輸入格式正確的URL地址,Opera中會(huì)自動(dòng)在開始處添加http://

3.日期時(shí)間相關(guān)輸入類型:

 
 
 
  1.  
  2.  
  3.  
  4.  

這一系列是很酷的一個(gè)類型,完全解決了煩瑣的JS日歷控件問題.但目前MS只有Opera/Chrome新版本支持,且展示效果也不一樣。

4.number輸入類型:

 
 
 
  1.  

此類型將顯示一個(gè)可拖動(dòng)的滑塊條,并可通過設(shè)定max/min/step值限定拖動(dòng)范圍.拖動(dòng)時(shí)會(huì)反饋給value一個(gè)值。

5.search輸入類型:

 
 
 
  1.  

此類型表示輸入的將是一個(gè)搜索關(guān)鍵字,通過results=s可顯示一個(gè)搜索小圖標(biāo)。

6.tel輸入類型:

 
 
 
  1.  

此類型要求輸入一個(gè)電話號(hào)碼,但實(shí)際上它并沒有特殊的驗(yàn)證,與text類型沒什么區(qū)別。

7.color輸入類型:

 
 
 
  1.  

此類型可讓用戶通過顏色選擇器選擇一個(gè)顏色值,并反饋到value中。

三、新的表單屬性

1.placeholder屬性

 
 
 
  1.  

這是一個(gè)很實(shí)用的屬性,免去了用JS去實(shí)現(xiàn)點(diǎn)擊清除表單初始值.瀏覽器支持也還不錯(cuò),MS除了Firefox,其他標(biāo)準(zhǔn)瀏覽器都能很好的支持.

2.require/pattern屬性

 
 
 
  1.  
  2.  
  3.  

表單驗(yàn)證屬性,require類型時(shí),若輸入值為空,則拒絕提交,并會(huì)有一個(gè)提示.上面兩種寫法都對(duì),這個(gè)很有用.并且可以用于textarea以及hidden/image/submit類型.pattern類型為正則驗(yàn)證,可以完成各種復(fù)雜的驗(yàn)證.這兩種類型在Opera中必須指定name值,否則無效果。

3.autofocus屬性

 
 
 
  1.  

默認(rèn)聚焦屬性,可在頁面加載時(shí)聚焦到一個(gè)表單控件,類似于JS的focus()。

4.list屬性

 
 
 
  1.  
  2.  
  3.  
  4.  
  5.  
  6.  
  7.  

該屬性需要與datalist屬性共用,datalist是對(duì)選擇框的記憶,而list屬性可以為選擇框自定義記憶的內(nèi)容。

5.max/min/step屬性:

 
 
 
  1.  

限制值的輸入范圍,以及值的輸入漸進(jìn)程度,比如可在number設(shè)定輸入***值最小值,或者在range中設(shè)定拖動(dòng)階梯。

6.autocomplete屬性:

 
 
 
  1.  

此屬性是為表單提供自動(dòng)完成功能.如果該屬性為打開狀態(tài)可很好地自動(dòng)完成.一般來說,此屬性必須啟動(dòng)瀏覽器的自動(dòng)完成功能.

7.data屬性

 
 
 
  1.  

要為一個(gè)select下拉別表動(dòng)態(tài)的添加非常多的選項(xiàng),這些選項(xiàng)大多數(shù)都是來自數(shù)據(jù)庫,比如說國家、省市列表等等。這個(gè)事情非常繁瑣。HTML5將支持data屬性,為select控件外聯(lián)數(shù)據(jù)源!

8.XML Submission編碼格式

我們一般常見的是Web Form的編碼格式是application/x-www-form-urlencoded。開發(fā)人員都很清楚這種格式,數(shù)據(jù)送到服務(wù)器端,可以方便的存取。HTML5提供一種新的數(shù)據(jù)格式:XML Submission,即application/x-www-form+xml。簡單的舉例說,服務(wù)器端將直接接收到XML形式的表單數(shù)據(jù)。

HTML5對(duì)表單控件的更新,無疑是很振奮人心的。相信隨著標(biāo)準(zhǔn)的深入開發(fā)以及瀏覽器對(duì)HTML5支持程度的進(jìn)一步提升,設(shè)計(jì)一個(gè)簡單易用的表單的工作,將變得非常輕松。

本文地址:http://www.yiiyaa.net/1350


當(dāng)前文章:詳細(xì)介紹HTML5表單的新功能
URL網(wǎng)址:http://www.dlmjj.cn/article/cohijph.html