美文网首页
移动端固定底部的键盘随系统键盘弹起问题

移动端固定底部的键盘随系统键盘弹起问题

作者: halapro_liu | 来源:发表于2018-12-28 14:01 被阅读4次

    1、Android端,可以监听resize事件,进行显示隐藏按钮

    initEvents () {
      // 解决android端底部按钮随键盘弹起问题
      window.addEventListener('resize', this.toggleResize, false)
    },
    toggleResize (e) {
      // 定时器是解决有的手机会触发两次事件
      this.resizeTimer = this.resizeTimer ? null : setTimeout(() => {
        this.isFocus = !this.isFocus
      }, 0)
    }
    

    2、IOS端,可以监听focus和blur事件,进行显示隐藏按钮
    contenteditable模拟的输入框,需要先添加tabindex才可以监听focus事件

    window.addEventListener('focusin', (e) => {
      this.focus = true
    }, false)
    
    window.addEventListener('focusout', (e) => {
      this.focus = false
    }, false)
    

    相关文章

      网友评论

          本文标题:移动端固定底部的键盘随系统键盘弹起问题

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