input type date 的相容性等問題

2021-07-30 05:08:25 字數 794 閱讀 2771

html5 input date 移動端 ios 不支援問題(不支援顯示是:預設的樣式是年/月/日然後是有上下小三角的箭頭。)

桌面端(mac)

safari 不支援 datepicker,placeholder 正常顯示。

firefox 不支援 datepicker,placeholder 正常顯示。

chrome 支援 datepicker,顯示 年、月、日 格式,忽略 placeholder。

移動端iphone5 ios7 有 datepicker 功能,但是不顯示 placeholder。

andorid 4.0.4 無 datepicker 功能,不顯示 placeholder

從上面可以看出,ios 上會有 date 不會顯示 placeholder 文字,android 部分機型沒有 date 也不會顯示 placeholder 文字。但是為了統一表單外觀,往往需要顯示。

解決方法:

先使其 type 為 text,此時支援 placeholder,當觸控或者聚焦的時候,使用 js 切換使其觸發 datepicker 功能。

<inputplaceholder="date" class="textbox-n" type="text" onfocus="(this.type='date')"  id="date">

還有個解決方法:先刪除他的placeholder的屬性再新增上。

$("input[type='date']").bind(,

blur:function()}})

input type date 預設樣式修改

最近寫乙個頁面,用到了date型別的input,不得不說,挺好用的,免去了額外引入第三方外掛程式的麻煩,但與此同時,也出現了新的麻煩,那就是input type date 自帶的一些樣式,比如刪除icon,上下箭頭等等,著實讓人頭疼,下面我介紹下幾種去除此類樣式的方法。date value 1993...

Android SDK中的Support相容包詳解

背景 support library 我們都知道android一些sdk比較 為此google官方提供了android support library package 系列的包來保證高版本sdk開發的向下相容性,所以你可能經常看到v4,v7,v13這些數字,首先我們就來理清楚這些數字的含義,以及它們...

12 2 教師兼幹部

作 者 霍雨佳 完成日期 2014 年5月13日 版 本 號 v1.0 問題描述 分別定義teacher 教師 類和cadre 幹部 類,採用多重繼承方式由這兩個類派生出新類teacher cadre 教師兼幹部 樣例輸入 樣例輸出 專案要求 1 在兩個基類中都包含姓名 年齡 性別 位址 等資料成員...