美文网首页
wap 端 input 获取焦点后弹出键盘, 元素不在可视范围内

wap 端 input 获取焦点后弹出键盘, 元素不在可视范围内

作者: 龙权 | 来源:发表于2016-05-26 11:08 被阅读347次

    // .container 设置了 overflow 属性, 导致 Android 手机下输入框获取焦点时, 输入法挡住输入框的 bug
    // 相关 issue: https://github.com/weui/weui/issues/15
    // 解决方法:
    // 0. .container 去掉 overflow 属性, 但此 demo 下会引发别的问题
    // 1. 参考 http://stackoverflow.com/questions/23757345/android-does-not-correctly-scroll-on-input-focus-if-not-body-element
    // Android 手机下, input 或 textarea 元素聚焦时, 主动滚一把
    if (/Android/gi.test(navigator.userAgent)) {
    window.addEventListener('resize', function () {
    if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
    window.setTimeout(function () {
    document.activeElement.scrollIntoViewIfNeeded();
    }, 0);
    }
    })
    }

    相关文章

      网友评论

          本文标题:wap 端 input 获取焦点后弹出键盘, 元素不在可视范围内

          本文链接:https://www.haomeiwen.com/subject/qcfxdttx.html