移動端兼容問題(5)

好久沒有總結了，繼續發佈遇到一些兼容問題，歡迎溝通。

ios 鍵盤輸入後，頁面偏移，致使頁面響應區域沒法點擊

進行輸入操做後，如圖區域是沒法點擊的。

解決方法

if (/(iPhone|iPad|iPod|iOS)/i.test(window.navigator.userAgent)) {
      document.activeElement.scrollIntoViewIfNeeded(true)
    }

20191016補充：
常規文檔流中，使用上速方式便可或者修改成下列方式:

if(isIOS()) {
    document.activeElement.scrollIntoView(false)
}

脫離文檔流能夠採用下列方式:

let scrollY = 0
const handleBlur = function() {
    window.scrollTo(0, scrollY)
}

const handleFocus = function() {
    scrollY = window.scrollY
}
document.querySelector('input').addEventListener('blur', handleBlur)
document.querySelector('input').addEventListener('focus', handleFocus)

經過記錄位置手動轉化便可。

緣由:

在ios下，若是一個input在fixed定位下，就會出現該問題，webkit問題地址，根據問題描述如果父級元素不在fixed下則能夠避免。

https://hackernoon.com/how-to...

ios下 輸入法推薦文字沒法觸發change或者input事件。

解決方式:
經過輸入框的 onblur事件來獲取一次數據，解決沒法獲取數據問題。