h5问题总结

安卓移动端键盘调起表单被遮挡

focus(){
  this.currentY = document.documentElement.scrollTop ||document.body.scrollTop;
  let top = document.body.scrollHeight;
  if(this.$refs['input'].offsetTop > top/2){
    setTimeout(function () {
        window.scrollTo(0,top);
    }, 500);
  }
}

ios键盘收起页面底部留白

blur(){
window.scrollTo(0,this.currentY)　
},

var currentY;
$('.form').focusin(function(){
    currentY = document.documentElement.scrollTop ||document.body.scrollTop;
})
$('.form').focusout(function(){
    window.scrollTo(0,currentY)
})

div点击背景高亮

body { -webkit-tap-highlight-color: rgba(0, 0, 0, 0) }

输入框失焦事件和点击事件一起出发点击时间不执行

ckick事件️换成onmousedown

H5解决安卓环境下点击输入框页面(图片)变形问题

第一步：给页面容器给个固定高度，最好的方式就是动态绑定高度，如下：

<div class="dow-box" :style="{height:bgHeight}"></div>

第二步：在data中定义变量，在created初始化后获取屏幕高度赋值给绑定高度变量

this.bgHeight = document.body.scrollHeight + "px";

ios下验证码发送两遍

oninput="if(value.length>4)value=value.slice(0,4)"

移动端点击可点击元素时，出现蓝色默认背景色

-webkit-tap-highlight-color: transparent;