Is there any javascript event fired when the on-screen keyboard on mobile safari or chrome opens?

两盒软妹~` 提交于 2019-11-30 02:09:27

问题


I try to react to the on-screen keyboard in our web applications. Unfortunately there are some things complicating this:

First of all, the application has to run equally on mobile platforms (tablets) and desktops. Additionally scrolling the document/body is forbidden and to spice things up even more, landscape mode is mandatory on tablets.

So, if someone selects any input field, the on-screen keyboard opens up and blocks the sight on half of the page, therefor some inputs become invisible and I need to change that.

Unfortunately it seems, there is no event fired at all, which indicates, that half of the application just became invisible. I already checked scroll and resize events, but they didn't fire, too.

Of course, I could always react somehow as soon as I'm sure to be on a tablet. Probably 95% of the users will not attach a hardware keyboard anyway. But isn't there any cleaner way?


回答1:


Unfortunately the answer here is a clear: NO. There are some related questions here with some further information and tricks:

screen styling when virtual keyboard is active

iPad Web App: Detect Virtual Keyboard Using JavaScript in Safari?

Android/iPhone webkit, event triggered on keyboard pop?




回答2:


The resize event will fire when the keyboard resizes your page. Add an onresize event handler on your window and adjust the scrolling as needed.




回答3:


Did you try the focus event?

So you can lock the min-height of the form (or other parent element) with a class when keyboard appears, and so the user can scroll touching screen when a input is selected.

I was looking for a similar issue, and this trick resolves my case. =)



来源:https://stackoverflow.com/questions/27132796/is-there-any-javascript-event-fired-when-the-on-screen-keyboard-on-mobile-safari

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!