解決IOS端微信H5頁面軟鍵盤彈起后頁面下方留白的問題
前言:微信H5項目,ios端出現(xiàn)了軟鍵盤輸完隱藏后頁面不會回彈,下方會有一大塊留白
最近微信和ios都有版本升級,不知道是哪邊升級造成的,但是經(jīng)過測試,軟鍵盤收起后,再滾動一下頁面,下面的留白就會消失。所以只要在輸入完畢后模擬一下這個“滾動”的操作,就能解決問題了。
如果是用vue寫的:
<input type="text" @blur="fixScroll" placeholder="請輸入xxx"/> //methods中添加: fixScroll() { window.scrollTo(0, 0); }
因為這個問題只在iOS端出現(xiàn)所以使用前進行一下判斷:
fixScroll() { let u = navigator.userAgent; let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端 if (isiOS) { window.scrollTo(0, 0); } }
總結(jié)
以上所述是小編給大家介紹的解決IOS端微信H5頁面軟鍵盤彈起后頁面下方留白的問題,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
vue項目中如何實現(xiàn)element-ui組件按需引入
這篇文章主要介紹了vue項目中如何實現(xiàn)element-ui組件按需引入,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-05-05Vue+Echarts報錯Cannot?set?properties?of?undefined?(settin
這篇文章主要介紹了Vue+Echarts報錯Cannot?set?properties?of?undefined?(setting?‘plate‘)的問題及解決方案,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-08-08打包組件報錯:Error:Cannot?find?module?'vue/compiler-sfc&ap
最近遇到這樣的問題,vue組件庫搭建過程中使用webpack打包組件時報錯,本文給大家分享打包組件報錯:Error:?Cannot?find?module?‘vue/compiler-sfc‘的解決方法,感興趣的朋友一起看看吧2023-12-12