做一個類似於手機端QQ動態詳情頁面,該頁面有一個置於頁面底部的評論輸入框,剛開始單純的以為這沒什么難的,使用fixed布局不就是So easy!么,在安卓上也是意料之中完美的效果,然並卵,在ios上有時輸入框卻被軟鍵盤遮擋,經過在度娘上的多方查找,發現原來是ios對fixed布局有兼容問題,導致fixed布局不穩定,軟鍵盤彈起時fixed布局可能會改為absolute布局,總之這是一個需要修復的bug,又是各種搜索之后,看到了前輩們對這種問題的各種經驗,作為一個前端新手,我只能GET到一些JS的解決方法,最終解決辦法如下:
// 輸入框在iphone中被遮擋問題 if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { $('.comment-panel input').on('touchstart',function(e){ document.body.scrollTop = document.body.scrollHeight; }); }
但是經過測試發現當ios的采用搜狗輸入法的時候,有時會有遮擋一半輸入框,這個問題出現的幾率很小,但仍未解決,這也算是系統的一個bug,希望有解決的前輩們看到能指點一二!
