zoukankan      html  css  js  c++  java
  • 关于移动端解决键盘遮挡input的解决方案

    我是利用scrollIntoView()方法来解决这个问题的,代码

    let clientHeight = document.body.clientHeight;
      let _focusElem = null; //输入框焦点
      //利用捕获事件监听输入框等focus动作
      document.body.addEventListener("focus", function(e) {
        _focusElem = e.target || e.srcElement
      }, true);
      //因为存在软键盘显示而屏幕大小还没被改变,所以以窗体(屏幕显示)大小改变为准
      window.addEventListener("resize", function() {
        if (_focusElem && document.body.clientHeight < clientHeight) {
          //焦点元素滚动到可视范围的底部(false为底部)
          _focusElem.scrollIntoView(false)
        }
      });
    scrollIntoView()这个方法有一个参数是类型Boolean,默认false, 如果为false输入框沿底部显示,为true则沿顶部显示
  • 相关阅读:
    神经网络
    机器学习摘要
    one-vs-all案例
    VHDL
    docker 摘要(入门版)
    Windows与Unix思想
    安装 fedora 之后
    逻辑回归实战
    TensorFlow安装
    Haskell语言学习笔记(65)Data.HashMap
  • 原文地址:https://www.cnblogs.com/bozhiyao/p/9034841.html
Copyright © 2011-2022 走看看