分享HTML5虚拟键盘出现挡住输入框的解决办法


本文摘自PHP中文网,作者小葫芦,侵删。

本文主要分享HTML5虚拟键盘出现挡住输入框的解决办法。具有很好的参考价值,下面跟着小编一起来看下吧

话不多说,请看代码:


1

2

3

4

5

6

7

//防止键盘把当前输入框给挡住

$$('input[type="text"],textarea').on('click', function () {

  var target = this;

  setTimeout(function(){

        target.scrollIntoViewIfNeeded();

   },100);

});

部分安卓机型适用。


1

2

3

4

5

6

7

8

9

if(/Android [4-6]/.test(navigator.appVersion)) {

    window.addEventListener("resize", function() {

        if(document.activeElement.tagName=="INPUT" || document.activeElement.tagName=="TEXTAREA") {

            window.setTimeout(function() {

document.activeElement.scrollIntoViewIfNeeded();

            },0);

        }

    })

}

以上就是分享HTML5虚拟键盘出现挡住输入框的解决办法的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

HTML5内联svg教程以及与canvas的区别

h5中怎样使用postmessage实现两个网页间传递数据

10个HTML5代码片段可在网站制作中随时可用详解

有关HTML5页面在iphonex适配问题

HTML5实践-如何使用css3丰富图片样式的详解(二)

HTML5/css3 网页加载进度条的实现,下载进度条等经典案例

带你认识HTML57个混合式移动开发框架

HTML5的表单中关于所有type类型的详细介绍

详解HTML5浏览器兼容性解决方案

h5手机扫码怎么实现

更多相关阅读请进入《HTML5》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...