一、ios移动端 软键盘收起后，页面内容被顶上去，不下滑回原处javascript
代码以下：html
$(function(){
$('input,textarea').on('blur',function(){
window.scroll(0,0);
});
$('select').on('change',function(){
window.scroll(0,0);
});
})
原理就是弹起键盘的时候，window.scrollY会从0变到键盘的高度（例如：200），当输入框焦点失去后让scrollY回到0就行了。html5
可是有一个很严重的问题：若是页面上有按钮须要操做 ，例如，评论的输入框+发布按钮，输入完文字，点击“发布”，触发click事件的时候，会致使页面先触发blur事件，键盘回落，而后一切就结束了。。。。按钮点击没有起任何做用。java
解决方案： 把click事件更换成ontouchstart 能够解决这个问题。 ontouchstart 事件优于click事件触发。android
二、移动端 input,按钮等样式在安卓与ios上不一样的解决方案ios
input,select,button{
-webkit-appearance:none;
appearance:none;
}
去掉 IOS默认样式便可web
三、IOS上下拉动滚动条时卡顿、慢ajax
body {
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}
四、ios页面拖动问题小程序
body {
/* 当手指从触摸屏上移开，滚动会当即中止 */
-webkit-overflow-scrolling: auto
overflow-scrolling: auto
}
五、iphone及ipad下输入框默认内阴影微信小程序
-webkit-appearance: none;
六、日期问题
对于yyyy-mm-dd hh:mm:ss 这种格式在ios系统不识别。
时间格式化的时候，在浏览器端处理好好的，到了手机端，就变成NAN，或者null，这种状况，是ios系统不能转化这种类型的时间。
let date = new Date('2019-02-28 18:33:24'); // null
解决方案：转成 yyyy/mm/dd hh:mm:ss 这种格式就能够了。
replace(/-/g, "/")
七、ios在微信小程序的webview，键盘收回，页面底部会留白
这个问题怀疑是页面的scroll设置了auto致使的。
解决思路：
复现该bug之后发现只要滚动一下页面就可使页面恢复正常，因而就想可不能够在input失去焦点之后调用一下页面滚动，来完成该操做，发现果真能够。而后就产生了以下代码
temporaryRepair(){
var currentPosition,timer;
var speed=1;//页面滚动距离
timer=setInterval(function(){
currentPosition=document.documentElement.scrollTop || document.body.scrollTop;
currentPosition-=speed;
window.scrollTo(0,currentPosition);//页面向上滚动
currentPosition+=speed; //speed变量
window.scrollTo(0,currentPosition);//页面向下滚动
clearInterval(timer);
},1);
}
八、iphone fixed 失效，致使一些机器上textarea光标偏移
解决方案： 全部兄弟元素变成absolute， 父元素overflow:auto。
父元素{
height: 100vh;
position: relative;
overflow: auto;}
兄弟元素{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
overflow-x: visible;
overflow-y: auto;
padding-bottom: 10px;
z-index: 1;}
输入框若是使用了fixed固定在底部，键盘顶起的时候，iphone上fixed会失效，致使页面滚动输入框会随着页面滚动，而且在部分机型上，输入框偶尔会被键盘遮挡，这种偶现的问题，很不友好。
解决方案： 放弃使用fixed布局，页面若是有滚动，也放弃absolute，若是强行要使用absolute，请参考上一条光标偏移。建议使用flex布局，兼容性会获得解决。
固然，若是遇到以上这些问题，说明产品设计就很不合理，若是必要的话，仍是要更换设计，改为input不须要被键盘顶起的设计，这些兼容性的解决方案，也不并不能完美的解决全部机型的问题。
-webkit-tap-highlight-color:rgba(255,255,255,0)
十一、顶部状态栏背景色
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
说明：
除非你先使用apple-mobile-web-app-capable指定全屏模式，不然这个meta标签不会起任何做用。
若是content设置为default，则状态栏正常显示。若是设置为blank，则状态栏会有一个黑色的背景。若是设置为blank-translucent，则状态栏显示为黑色半透明。
若是设置为default或blank，则页面显示在状态栏的下方，即状态栏占据上方部分，页面占据下方部分，两者没有遮挡对方或被遮挡。
若是设置为blank-translucent，则页面会充满屏幕，其中页面顶部会被状态栏遮盖住（会覆盖页面20px高度，而iphone4和itouch4的Retina屏幕为40px）。
默认值是default。
问题是这样的，用input search作模糊搜索的时候，在键盘里面输入关键词，会经过ajax后台查询，而后返回数据，而后再对返回的数据进行关键词标红。
用input监听键盘keyup事件，在安卓手机浏览器中是能够的，可是在ios手机浏览器中变红很慢，用输入法输入以后，并未马上相应keyup事件，只有在经过删除以后才能相应！
解决办法：
能够用html5的oninput事件去代替keyup，而后就达到相似keyup的效果！
<script type="text/javascript"> document.getElementById('testInput').addEventListener('input', function(e){ var value = e.target.value; }); </script>