The container bounces back after the H5 keyboard on the mobile terminal disappears

It is easy to appear on ios. After the H5 page input loses focus, the system keyboard disappears voluntarily, but the external container is not reset.

The user’s scroll and resize actions (i.e. sliding the page and resizing the window) cause the page to constantly re-render the solution to make it scroll.

document.body.removeEventListener('focusout', ()=>{
      const scrollTop = document.scrollingElement.scrollTop;  
      document.scrollingElement.scrollTo(0, scrollTop)
});
Copy the code

There’s also that way

$('input').on('blur', function () {
          setTimeout(function(){
            var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
            window.scrollTo(0, Math.max(scrollHeight - 1, 0));
          }, 100);
});

Copy the code

The FocusOut event is fired when the element is about to lose focus. The main difference between a Focusout event and a blur event is that the latter does not bubble. 2. Focusout () can detect not only the out-of-focus event of the current element, but also the out-of-focus event of its children. Blur () does not detect out-of-focus events for child elements.