1.ios 中日期格式 new
date
('2019-10-11'
) 無效;
解決:new
date
('2019-10-11'
.replace
(/\-/g
,'/'))
;
2.ios 中日期格式 new
date
(' 2019-07-24 11:35:00.0'
) 無效;
解決:new
date
(' 2019-07-24 11:35:00.0'
.replace
(/\-/g
,'/').
replace
('.0',''
));
3.ios 中 input[type=
'date'
] placeholder 預設顯示空白問題;
解決( 用偽類新增乙個placeholder屬性,
onfoucs時removeattribute
('placeholder'),
onblur的時候setattribute
('placeholder',''
)): input[type=
'date'
]:before
input:
-webkit-input-placeholder
4.ios 中 overflow: scroll 滾動效果卡頓;
解決:-webkit-overflow-scroll: touch;
5.ios 中 input disabled 時的color 很淺;
原因: iphone safari/webview input disabled 會有預設樣式；
解決:
input:disabled
6.ios 中 transition, animation 屬性支援性很差, 會造成螢幕滑動抖動;
(暫時無法解決)
7.使用css偽類的content設定圖示時, 圖示顏色設定無效;
需增加以下配置;
原因: 資料查到說是ios9以後不再支援css更改這種符號的顏色, 如需要,使用 u
+fe0e
variation
selector
-15字元;
如: content: "\2714\fe0e;
8.ios使用input,啟用的時候會自動放大頁面問題;解決:
"viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
2. 同時強制設定input字型16px, 或者focus的時候設定16px;
(針對小於16px的input)
9.iphonex的body設定height:
100%
;底部會有24px的留白;
原因: 本人頁面因為使用html, body
, body:
100% 這個屬性並不能在iphonex撐滿可視區域;
解決:官方提供的meta
(我這裡使用好像沒效果)
;viewport-fit：有三個值contain：可視視窗完全包含網頁內容；cover：網頁內容完全覆蓋可視視窗；auto：同contain；
通過給頁面設定viewport-fit=cover，可以將頁面的布局延伸到頁面頂部和底部。
"viewport" content=
"width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no, viewport-fit=cover"
/>
於是(暫時解決問題方法時, 使用 height:
100vh)
app內嵌H5遇到的部分坑
1.input元件 input設定type number 鍵盤彈出為數字 問題 1 input的maxlength屬性失效 只能通過輸入事件來對輸入的值進行限制 2 樣式問題 在部分的android手機上面出現樣式問題，需要去掉input的預設樣式 2.select元件 select設定問題 1 禁...
H5內嵌原生app
因此，可以看到內嵌其實並不難，難就難在要適配 原生與web互動 資料傳遞等，當然我們也可以使用vue來開發h5介面 一 如何實現互動？答案是使用第三方外掛程式jsbridge 1.通過js偽造請求 原生攔截獲取資料 原理類似於jsonp 首先在js中定義乙個函式並掛載在window下，然後在原生中呼...
H5 344 微信 H5 頁面相容性解決方案
點選上方 前端自習課 關注，學習起來 都模糊處理了。問題詳情描述 input輸入框游標，在安卓手機上顯示沒有問題，但是在蘋果手機上 當點選輸入的時候，游標的高度和父盒子的高度一樣。例如下圖，左圖是正常所期待的輸入框游標，右邊是ios的input游標。出現原因分析 通常我們習慣用height屬性設定行...