js - 解决微信环境下，ios软键盘收起后页面空白

思路：1.判断是否在微信中
2.判断是否在ios中
3.表单元素焦点将页面滚回到顶部

是否是微信环境

  isWx() {

      let ua = navigator.userAgent.toLowerCase(); // 取得浏览器的userAgent字符串

      console.log(ua);

      if (ua.indexOf("micromessenger") > -1) {

        return true;

      } else {

        return false;

      }

    },

是否是ios终端

isIos(){

      let ua = navigator.userAgent.toLowerCase(); // 取得浏览器的userAgent字符串

      console.log(ua);

      if (ua.indexOf("iphone") > -1 || ua.indexOf("ios") > -1) {

        return true;

      } else {

        return false;

      }

    },

焦点消失滚动到顶部解决留白

    // 解决微信环境，ios下，键盘收起留白问题

    fixScroll() {

      if (this.isWx() && this.isIOS()) {

        console.log("解决留白");

        window.scrollTo({top: 0, left: 0, behavior: 'smooth'})

      }

    },

使用：

            <input

              type="text"

              @blur="fixScroll"

              v-model="graphicsCode"

              name="graphicsCode"

              placeholder="请输入图形验证码"

            />

巴特西

js - 解决微信环境下，ios软键盘收起后页面空白

最新文章

热门文章