关于H5在安卓ios平台兼容性问题，及解决方案

ios兼容问题

1.ios 表单元素 有内部阴影

解决方案

// css 
input{
  -webkit-appearance: none;
}

2.ios input 调用键盘屏幕上移后，失去焦点不自动回落

解决方案

//js
let myFunction
let isIos = true
if (isIos) { // 既是微信浏览器 又是ios============（因为查到只有在微信环境下，ios手机上才会出现input失去焦点的时候页面被顶起）
    document.body.addEventListener('focusin', () => { // 软键盘弹起事件
          clearTimeout(myFunction)
    })
    document.body.addEventListener('focusout', () => { // 软键盘关闭事件
          clearTimeout(myFunction)
          myFunction = setTimeout(function() {
                 window.scrollTo({top: 0, left: 0, behavior: 'smooth'})// 重点  =======当键盘收起的时候让页面回到原始位置
          }, 200)
   })
}

3.ios下不兼容keyup,keydown等事件：

解决方案

//js
document.getElementById('testautofocus').addEventListener('input', function(e){  }); 

4.IOS/safari设备上，接口返回日期为字符串格式「 yyyy-MM-dd hh:mm:ss」, 经过new Date(str)后会出现NAN

解决方案

// 正则  将 - 转为 /     .replace(/-/g,'/')
let dateStr = '2019-09-09 10:11:11'
let dateNum = new Date(dateStr.replace(/-/g,'/')).getTime()
console.log(dateNum) // 时间戳

5.ios系统手机打开相机并可选择相册功能

解决方案 capture（调用设备媒体）

capture 属性：在webapp上使用 input 的 file 属性，指定 capture 属性可以调用系统默认相机、摄像和录音功能。

capture表示，可以捕获到系统默认设备的媒体信息，如下：

capture="camera" 相机

capture="camcorder" 摄像机

capture="microphone"录音

// html

// js
$(function () {
    //获取浏览器的userAgent,并转化为小写
    var ua = navigator.userAgent.toLowerCase();
    //判断是否是苹果手机，是则是true
    var isIos = (ua.indexOf('iphone') != -1) || (ua.indexOf('ipad') != -1);
    if (isIos) {
        $("input:file").removeAttr("capture");
    };
})

安卓兼容问题

1.滑动不流畅问题，这个滑动不流畅好像局限于局部的滚动，建议都写成 全局滚动

解决方案

//css
 -webkit-overflow-scrolling: touch;