2020-3-20 14:17:57 | 作者:老鐵SEO | 0個評論 | 人瀏覽
定時器一般有兩個
1)setTimeout();//n毫秒后執行一次
2)setInterval();//每隔n秒執行一次
這兩個方法都有個返回值,返回一個定時器id,可以定義一個變量接收
清除定時器方法:
setTimeout()對應的是clearTimeout(id);
setInterval()對應的是clearInterval(id);
js定時器用法
問題:當一個頁面同時有兩個setInterval函數調用的沖突如何解決?
解決方法:
定義兩個變量并把setInterval賦值給變量
vara=setInterval(function(){------code------},1000)
varb=setInterval(function(){------code------},1000)
清除
clearInterval(a)
clearInterval(b)
舉例:
注:
setInterval()方法會不停地調用函數,直到用clearInterval()終止定時或窗口被關閉。
window.clearInterval()
功能:取消由setInterval()方法設置的定時器。
js定時器settimeout
setTimeout是延遲執行,只執行一次,不是定時器
多次間斷執行要用setInterval
vartimer=setInterval(function(){},1000);
取消用clearInterval(timer);
都是等待執行完畢后執行的,可以嘗試跑這段代碼:
setInterval(function(){
alert('每次同時只會出現一個');
},3000);<
>
setTimeout這個函數是在延時后執行1次。而setInterval是一直延時、執行重復。
js定時器重復執行
/**
*創建有上限時鐘
*@param{int}upperlimit上限次數
*@param{int}cycle間隔時間
*@param{Function}_callback回調函數
*@param{Function}_completeCallback執行完畢后調用的函數
*@return{Object}返回一個時鐘對象
*/
functioncreateUpperLimitTime(_upperlimit,cycle,_callback,_completeCallback){
varsuccessindex=0;
vartimeobj;
varupperlimit=_upperlimit;
varcallback=_callback||function(){};
varcompleteCallback=_completeCallback||function(){};
//先看到了沒再執行
console.log("定時器開始");
console.log(upperlimit);
varextendCallback=function(){
if(successindex>=upperlimit){
clearTimeout(timeobj);
completeCallback();//完成后對時鐘實例基本無需什么操作了,因此這里不提供也行
}else{
callback(timeobj);//實際上這個回調函數是可以獲得時鐘實例的
successindex++;
}
}
timeobj=window.setInterval(extendCallback,cycle);
returntimeobj;//返回這個時鐘對象,可以作用于終止
}
createUpperLimitTime(5,1000,function(){//測試
console.log(1);
},function(){
console.log(2);
});<
>
js定時器函數
都是等待執行完畢后執行的,可以嘗試跑這段代碼:
setInterval(function(){
alert('每次同時只會出現一個');
},3000);<
>
setTimeout這個函數是在延時后執行1次。而setInterval是一直延時、執行重復。
定時器第二個參數設置的就是間隔時間,將1000毫秒設為0就可以立即執行