解決IOS端微信H5頁(yè)面軟鍵盤(pán)彈起后頁(yè)面下方留白的問(wèn)題

前言：微信H5項(xiàng)目，ios端出現(xiàn)了軟鍵盤(pán)輸完隱藏后頁(yè)面不會(huì)回彈，下方會(huì)有一大塊留白

最近微信和ios都有版本升級(jí)，不知道是哪邊升級(jí)造成的，但是經(jīng)過(guò)測(cè)試，軟鍵盤(pán)收起后，再滾動(dòng)一下頁(yè)面，下面的留白就會(huì)消失。所以只要在輸入完畢后模擬一下這個(gè)“滾動(dòng)”的操作，就能解決問(wèn)題了。

如果是用vue寫(xiě)的：

<input type="text" @blur="fixScroll" placeholder="請(qǐng)輸入xxx"/>
//methods中添加：
fixScroll() {
 window.scrollTo(0, 0);
}

因?yàn)檫@個(gè)問(wèn)題只在iOS端出現(xiàn)所以使用前進(jì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頁(yè)面軟鍵盤(pán)彈起后頁(yè)面下方留白的問(wèn)題，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com