bug记录-setTimeout、setInterval之IOS7

本篇文章主要讲查找并分析bug的思路，相关的函数不是本文的重点。

众所周知，setTimeout和setInterval是用来作延迟调用以及周期性调用的方法，他们支持的参数都差很少。

setTimeout/setInterval的第一个参数为回调函数，能够是一个方法名，也能够是一个匿名函数。第二个参数就是延迟执行的时间，单位ms。

咱们能够这样用：

setTimeout(fn,1000);
function fn(){};
//还能够这样用
setTimeout(function(){},1000);
//interval同样

咱们demo上设置的延迟时间是1000ms，因为js是单线程的，实际的延迟时间可能会比 1000ms长，可是只要进程空闲时就会当即执行。（这也是为何建议使用setTimeout来代替setInterval的缘由）

好了，方法都解释的差很少了，直插主题吧。

一个简单的需求，当用户输入错误时显示一个tips，并在x秒后隐藏，超级简单对不对，开搞。

function hide(){
   //do hide
}
setTimeout(hide,5000)//在5000ms后作hide操做

uc，qq，chrome，什么国产手机自带浏览器都跑一遍吧，没任何问题，只有ios7的safari，若是一直滑动的话，不会执行延迟操做，只有中止滑动才会执行，并且是当即执行（大概延迟800ms左右）

比较棘手啊，这种状况有点像在有些浏览器上滑动时，gif动图会中止运动（有遇到过页面滑动，js动画都中止的），猜想会不会是一种优化手段呢，因而

var count =0,startTime=new Date().getTime(),endTime;
            timer=setTimeout(function(){
                //endTime = new Date().getTime();
                var a = document.createElement("p");
            a.innerText = endTime-startTime;
            document.getElementById("demo").appendChild(a)
                alert("ok");
                
        },2000)
            window.addEventListener("touchend",function(){
                endTime = new Date().getTime();
                count+=1;
                var a = document.createElement("p");
            a.innerText = startTime+"---"+endTime;
            document.getElementById("demo").appendChild(a)
            },false)

开始监听的是touchmove事件，证实滑动不会影响除延时函数之外的其余js执行。

监听touchend事件，滑动结束后并非2000ms执行回调，测试大概是800ms左右。

根据上面的测试，咱们能大概的来猜想下，ios7中safari作了滑动优化，在滑动的过程当中阻止延迟事件的执行，在滑动结束后再执行。

解决方法

其实这种状况，没什么好解决的（不要打我），由于ios7的确是很老的系统了。可是咱们为了精益求精仍是得研究下的。

1.因为是滑动形成的，那咱们直接干掉滑动吧，在hide之后再开启（在tips消失以前滑动不了页面）

2.作一个兼容，若是用户滑动了，记录滑动的开始时间和move时间，两个的差值若是大于延迟时间就直接执行回调

 

时间仓促，写的有点匆忙（今天星期五啊。。），若是有什么遗漏或者错误的地方欢迎指出