How to solve the problem that the soft keyboard blocks the input box in js

Below I will recommend a js solution to the problem of soft keyboard blocking the input box. It has a good reference value and I hope it will be helpful to everyone.

Experience Notes

When the soft keyboard pops up:

ios End$('body').scrollTop() will change

android end$(window).height() will change

It’s not a moment when you pull up the keyboard, but there is a slow motion Process

Problem Reproduction

On the ios side, there is often a problem of the input method blocking the input box (especially the one with a white top input method, such as: Baidu input method), as shown in the figure:

Problem Solving

We You only need to start a timer after the input box is focused and execute $('body').scrollTop(1000000). In this way, since the entire body is scrolled to the bottom, the input box will naturally be visible. Please see the following example for details

Sample source code

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

vue vuex vue-rouert permission routing (detailed tutorial)

How to implement orderBy sorting and blurring in Angular Query

How to implement sensitive text prompts in Angular

How to implement hidden display in Angular

How to realize left and right sliding of pictures in js

The above is the detailed content of How to solve the problem that the soft keyboard blocks the input box in js. For more information, please follow other related articles on the PHP Chinese website!