Ios soft keyboard problem, soft keyboard up to cover input, input lost focus at the bottom of the ios page blank (page is pushed up)
In ios, the input box is blocked by the soft keyboard, so add this code to the body
(function () { window.addEventListener(‘resize’,function () { tid = setTimeout(function () { if(document.activeElement.tagName === ‘INPUT’){ window.setTimeout(function() { if(‘scrollIntoView’ in document.activeElement) { document.activeElement.scrollIntoView(); } else { document.activeElement.scrollIntoViewIfNeeded(); }}, 0); }}, 300)}); }) ()
Ii. The soft keyboard of iPhone pops up, and when the input loses focus, the bottom of the phone will be blank (generally in the case of full-screen design) :
(1) If it is a full-screen design page, obtain the height of the current scroll bar when the frame pops up
onBlur() { setTimeout(function() { var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0; window.scrollTo(0, Math.max(scrollHeight – 1, 0)); console.log(“scrollTo1:” + Math.max(scrollHeight – 1, 0)); }, 1); this.$refs.boxscroll.scrollTop = this.scrolltoptext; } (2) If it is not a full-screen phone, both the length of the design page is very long, and you want to keep the original position when the popbox disappears: both get the height of the current scroll bar this.scrollTopText; , save, when loses focus can onBlur () {this. Refs. Boxscroll. ScrollTop = this. Scrolltoptext; },