javascript - Mobile page The mobile keyboard blocks the input box-PHP Chinese Network Q&A

Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

javascript - Mobile page The mobile keyboard blocks the input box

迷茫 2017-06-22 11:53:59

1164

normal circumstances

question

Every time when the phoneswitches apps or windows, and then returns to this pageFor the first time, the keyboard will block the input box, only the first time Clicking will block it.
What causes this?
Then I found that the scroll bar of the page did not scroll to the bottom at this time, so I bound an event to the input box when it was focused
$('.input').on('focus', function( ) {

$(window).scrollTop(99999);

});
But the scroll bar of the page still does not scroll to the bottom, and the input box is still blocked by the keyboard.

$(document) $('body, html') 也试过了.

迷茫

业精于勤，荒于嬉;行成于思，毁于随。

reply all (4)

仅有的幸福2017-06-22 11:55:59 4 floor

The Android browser will not recalculate the height of the window like the iOS browser after the soft keyboard pops up, so the height of the Android browser window when the soft keyboard pops up is "the height of the soft keyboard + (the height of the window - the soft keyboard height)"; in fact, at this time, the reasonable height should be the height of the page + the height of the soft keyboard pop-up; the solution is as follows:

var winHeight = $(window).height(); //获取当前页面高度 $(window).resize(function() { var thisHeight = $(this).height(); if (winHeight - thisHeight > 50) { //当软键盘弹出，在这里面操作 //alert('aaa'); $('body').css('height', winHeight + 'px'); } else { //alert('bbb'); //当软键盘收起，在此处操作 $('body').css('height', '100%'); } });