zoukankan      html  css  js  c++  java
  • h5软键盘弹起 底部按钮被顶起问题解决

    解决思路:
    当键盘弹起时隐藏掉按钮,键盘隐藏时按钮显示
    监测键盘是否弹起(浏览器页面是否发生变化)
    代码:
    1、定义一个底部按钮

    <div class="returnbtn" v-show="isOriginHei" :class="{active: canSubmit}" v-on:click="sendSubmit()">提交</div>


    2、设置默认显示和两个屏幕的初始值(此处定义在vue的data中)

      isOriginHei: true,
      screenHeight: document.documentElement.clientHeight, //此处也可能是其他获取方法
      originHeight: document.documentElement.clientHeight,


    3、在mounted里面挂载检测浏览器变化

      mounted() {
        let self = this;
        window.onresize = function() {
          return (function(){
            self.screenHeight = document.documentElement.clientHeight;
          })()
        }
      }


    4、在watch中监测屏幕变化

      screenHeight (val) {
        if(this.originHeight > val + 100) { //加100为了兼容华为的返回键
          this.isOriginHei = false;
        }else{
          this.isOriginHei = true;
        }
      }


    作者:kuke_kuke
    来源:CSDN
    原文:https://blog.csdn.net/qq_33599109/article/details/79086411

  • 相关阅读:
    python线程同步
    闭包、装饰器
    python中的return返回值
    常用内建函数
    python迭代器与生成器
    python基础之数据类型
    VS生成解决方案时报错: Your project does not reference ".NETFramework,Version=v4.5"
    Unity 低版本打开高版本项目
    关闭应用程序的所有子窗体
    按钮接收 Enter 键
  • 原文地址:https://www.cnblogs.com/Mr-Rshare/p/10694566.html
Copyright © 2011-2022 走看看