input標(biāo)簽的type屬性及兼容性

input標(biāo)簽type的值有很多,今天就來給大家總結(jié)一下

1. < input type ="button"> 定義可點擊按鈕 (這個不用我多說,做前端應(yīng)該都知道)

2.< input type ="checkbox"> 定義復(fù)選框,允許用戶選擇中選取一個或多個選項。

3.< input type ="file"> 用于輸入字段和 "瀏覽"按鈕,文件上傳。不過這個在ie下有個兼容性問題,不能上傳文件,其實這個是IE的安全限制問題,就是在ie下必須點擊file的瀏覽按鈕才能上傳文件,既然IE非得要親自點擊,我們可以改變思路,解決的思路就是:我們可以讓< input type ="file">設(shè)置成絕對定位,位于某個標(biāo)簽之上,這樣就可以啦,如果你想改變我們?nèi)庋劭吹降臉邮?,你可以?lt; input type ="file">設(shè)置成透明的,然后去改變下面標(biāo)簽的樣式就ok啦。

4.< input type ="hidden">用于定義隱藏的字段,這個很important,通常如果你想給不想讓用戶看見又能前后端交互,這個就很方便了,其實在實際操作中< input type ="text"> css樣式設(shè)為display:none,也可以實現(xiàn)在各種效果,本人目前還不知道他倆有啥區(qū)別

5.< input type ="image" src="圖片路徑" alt="">用于定義圖像形式的提交按鈕

6.< input type ="password">定義密碼字段。

7.< input type ="radio">定義單選按鈕。允許用戶選取給定數(shù)目的選擇中的一個選項,例如,讓用戶選擇性別的時候用到。

8.< input type ="reset">定義重置按鈕。重置按鈕會清除表單中的所有數(shù)據(jù)。

9.< input type ="submit">定義提交按鈕。提交按鈕會把表單數(shù)據(jù)發(fā)送到服務(wù)器。

10.< input type ="text">定義單行的輸入字段,用戶可在其中輸入文本。默認(rèn)寬度為 20 個字符。

11.< input type ="number"> 定義用戶只能輸入數(shù)字,這個用在移動端當(dāng)用戶觸發(fā)了這個input之后,彈出的小鍵盤直接數(shù)字,特別方便

12.< input type ="tel"> 定義用于電話號碼的文本字段

13.< input type ="email"> 定義郵件的文本字段

14.< input type ="range"> 定義帶有 slider 控件的數(shù)字字段

15.< input type ="time"> 定義日期字段的時、分、秒

16.< input type ="search"> 定義用于搜索的文本字段

17.< input type ="url"> 定義用于 URL 的文本字段

18.< input type ="week"> 定義日期字段的周

19.< input type ="month">定義日期字段的月

20.< input type ="datetime-local">定義日期字段

21.< input type ="datetime">定義日期字段

22.< input type ="date">定義日期字段

23.< input type ="color">定義拾色器


就這么多啦,歡迎大家吐槽。。。。。。。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,568評論 19 139
  • HTML標(biāo)簽解釋大全 一、HTML標(biāo)記 標(biāo)簽:!DOCTYPE 說明:指定了 HTML 文檔遵循的文檔類型定義(D...
    米塔塔閱讀 3,530評論 1 41
  • ¥開啟¥ 【iAPP實現(xiàn)進(jìn)入界面執(zhí)行逐一顯】 〖2017-08-25 15:22:14〗 《//首先開一個線程,因...
    小菜c閱讀 7,334評論 0 17
  • 【春暖花開】20170411周一學(xué)習(xí)力踐行day25 開口遲尋因;慢!慢!慢下來與例行踐行 今天回家非常晚,例行踐...
    Sophie2liu閱讀 186評論 0 0
  • 信仍未寫完 從春苗萌發(fā)到樹葉落下 院子里的柿子樹掛滿紅燈籠 杏子也成了滿樹的金黃 莫說寒蟬凄切 只道秋意涼 濕漉漉...
    莊周大叔閱讀 278評論 0 3

友情鏈接更多精彩內(nèi)容