After WeChat IOS 6.7.4 version pops up the keyboard in the input box, the page is not restored

In ios, when the keyboard pops up, the page will move up, so that the input box is displayed in the middle of the page, and the keyboard hidden page will move down to restore the original state

In version 6.7.4, there will be no reversal, which will cause the nodes with relative positioning (fixed, absolute: relative to the browser window) to shift, causing the node click event to shift and cannot be selected

Solution: The input box loses focus (that is, when the keyboard is hidden), manually adjust the page, document.activeElement.scrollIntoViewIfNeeded(true)

When each input box loses focus, respond to the following events

function blurAdjust( e ){
	setTimeout(()=>{
		if(document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA'){
			return
		}

		let result = 'pc';
	    if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { //判断iPhone|iPad|iPod|iOS
	        result = 'ios'
	    }else if(/(Android)/i.test(navigator.userAgent)) {  //判断Android
	        result = 'android'
	    }

	    if( result = 'ios' ){
			document.activeElement.scrollIntoViewIfNeeded(true);
	    }
	},400)
}

TIP: A delay of 400 milliseconds is set here, in order to prevent multiple adjustments when there are multiple input boxes on a page, which will cause the page adjustment to be disordered

Guess you like

Origin blog.csdn.net/Mr_linjw/article/details/85050920