When the input, select, and textarea of Apple mobile phone lose focus, the page will not return

Time:2020-1-19

I am a brick, where to move!
In mobile project development, we often encounter strange problems, which is normal. However, due to the differences between IOS and Android, adaptation problems often occur.
In fact, when the input, select, and textarea of Apple’s mobile phone lose focus, the problem of page not returning to its place is common.
Problem analysis:
When Android calls the keyboard, it floats directly on the page, while IOS sets the page as a whole, so when the keyboard is retracted, the page will not automatically return to its original position.
Problem presentation:
When the input, select, and textarea of Apple mobile phone lose focus, the page will not return

*Status above ISO (top of page)*

When the input, select, and textarea of Apple mobile phone lose focus, the page will not return

*Android keyboard floating on the page*

resolvent:
Two short JS, perfect ending question.

//Lose focus
$("input,select").blur(function(){
  var top = $("body").scrollTop();
  $("body").scrollTop(top);
});
//Lose focus
$("input,select,textarea").blur(function(){
  $("body,html").scrollLeft(0);;
});

When the input, select, and textarea of Apple mobile phone lose focus, the page will not return

*IOS after solution*

The reason for the problem is that after the input box loses focus, the page does not interact and does not trigger the page to return to its original position, so when we lose focus, we will give him a feedback, so that we can perfectly end the problem described in the title.
I’m a brick. Move it if you need it