• 原生js解决ios手机input输入框弹出覆盖问题


    背景:

    软键盘弹起挡住input框
    软键盘弹起页面布局乱掉
    安卓手机 + 界面父级组件使用了overflow: hidden 导致键盘弹出(页面本质上变小了)仍然不可滚动
    解决思路:
    父级别不要使用overlow:hidden 或者 键盘弹起的时候去掉overflow: hidden.
    总之要确保键盘弹起的时候页面仍然可以拖动。 不然界面很容易乱
    实现原生js方法

    (function() {
      window.addEventListener("resize", function() {
        if (!document.activeElement) return;
        if (
          document.activeElement.tagName == "INPUT" ||
          document.activeElement.tagName == "TEXTAREA"
        ) {
          window.setTimeout(function() {
            document.activeElement.scrollIntoViewIfNeeded();
          }, 0);
        }
      });
    })();
    

      

  • 相关阅读:
    【BZOJ4444】国旗计划
    NOIp模拟赛三十一
    [arc086e]snuke line
    NOIp模拟赛三十
    [agc004f]namori
    [agc004d]salvage robot
    [agc016b]colorful hats
    NOIp模拟赛二十九
    [arc082f]sandglass
    Oracle性能报告--ASH
  • 原文地址:https://www.cnblogs.com/ygunoil/p/16624587.html
Copyright © 2020-2023  润新知