setinterval()是定時調(diào)用的函數(shù),可按照指定的周期(以毫秒計)來調(diào)用函數(shù)或計算表達式。setinterval()的作用是在播放動畫的時,每隔一定時間就調(diào)用函數(shù),方法或對象。setInterval() 方法會不停地調(diào)用函數(shù),直到 clearInterval() 被調(diào)用或窗口被關閉。由 setInterval()返回的ID值可用作clearInterval() 方法的參數(shù)。 setInterval動作的語法格式如下:
setInterval(function,interval[,arg1,arg2,......argn])
后面就兩個參數(shù)code是你的js代碼,millisec為時間間隔,以毫秒計。第一種格式是標準動作面板中setInterval函數(shù)的默認語法,第二種格式是在專家模式動作中使用的方法。其中的參數(shù)function是一個函數(shù)名或者一個對匿名函數(shù)的引用。object參數(shù)指定從Object對象派生的對象。methodName制定 object參數(shù)中要調(diào)用的方法。
interval制定對function或methodName調(diào)用兩次之間的時間,單位是毫秒。后面的arg1等是可選的參數(shù),用于制定傳遞給function或是methodName的參數(shù)。
setInterval它設置的時間間隔小于動畫幀速(如每秒10幀,相當于100毫秒),則按照盡可能接近interval的時間間隔調(diào)用函數(shù)。而且必須使用updateAfterEvent動作來確保以足夠的頻率刷新屏幕。如果interval大于動畫幀速,則只用在每次播放頭進入某一幀是才調(diào)用,以減小每次刷新屏幕的影響。
下面的例子每隔1秒調(diào)用一次匿名函數(shù)。
setInterval(function(){trace("每隔1秒鐘我就會顯示一次")},1000);//這里的function(){}是沒有函數(shù)名的函數(shù)。成為匿名函數(shù),后面的1000是時間間隔,單位是毫秒。
function show1(){
trace("每隔1秒顯示一次");
}
function show2(str){
trace(str);
}
setInterval(show1,1000);
setInterval(show2,2000,"每隔2秒我就會顯示一次");
上面已經(jīng)將函數(shù)的setInterval方法介紹了。下面我們將介紹對象的setInterval方法。
首先,寫一個setInterval在動作中調(diào)用對象的方法的例子,該例子不需要傳遞參數(shù)。
myobj=new Object();//創(chuàng)建一個新的對象
myobj.interval=function){
trace("每隔1秒顯示一次");
}//創(chuàng)建對象的方法。
setInterval(myobj,"interval",1000);//設定時間間隔調(diào)用對象的方法。
接下來介紹如何傳遞參數(shù)。其實道理和函數(shù)的傳遞參數(shù)是一樣的。myobj=new Object();
myobj.interval-function(str){
trace(str);
}
setInterval(myobj,"interval",2000," 每隔2秒我就會顯示一次");
注意。要調(diào)用為對象定義的方法時,必須在專家模式中使用第二種語法格式。這樣子的話呢,我們來作一個動態(tài)顯示時間的畫面。可以用下面的代碼實現(xiàn)。setInterval(show,1000);
function show(){
time=new Date();
hour=time.getHours();
minu=time.getMinutes();
sec=time.get.Seconds();
datetime=hour+":"+minu+":"+sec;
}//這里的datetime是一個動態(tài)文本框的變量名字。
function show(){
trace("每隔一秒我就會顯示一次");
}
var sh;
sh=setInterval(show,1000);
clearInterval(sh);
js實例代碼1:
function auto(){
alert("到時間了")
}
var monitorInterval = null;
function setAuto(time,isFrist){
var intervalTime=time;
if(isFrist!="1"){
if(intervalTime!="off"){
monitorInterval= setInterval("auto()", intervalTime*1000);
}else{
if(monitorInterval){
clearInterval(monitorInterval);
monitorInterval = null;
}
}
}
}
<table>
<tr>
<td nowrap="nowrap" bgcolor="#E8E8E8">自動更新</td>
<td align="left" bgcolor="#E8E8E8"><select
onchange="setAuto(this.value,'0')">
<option value="10">10sec</option>
<option value="20">20sec</option>
<option value="30">30sec</option>
<option value="60">1min</option>
<option value="300">5min</option>
<option value="600">10min</option>
<option value="1800">30min</option>
<option value="3600">60min</option>
<option value="off">Stay</option>
</select></td>
</tr>
</table>
我們知道Ext js加載Store是異步加載的,這有很多好處,這里不再說明。但有時也需要多個store同步加載,比如:動態(tài)解析生成圖表,需要同時加載完成圖表樣式、圖表軸、圖表序列和圖表數(shù)據(jù)之后才能完整解析生成圖表,任意一個store沒有加載完成時,解析數(shù)據(jù)都會造成解析錯誤,所以必須保證全部store加載完成后才能正確進行解析。要怎么保存多個store加載的同步呢?具體實現(xiàn)如下:
var bChartArr =[false, false, false, false];
//加載圖表軸
Ext.getStore("ChartAxes").load(
{
params:{ queryId:queryId },
callback:function(){
bChartArr[0] = true;
}
});
//加載圖表序列
Ext.getStore("ChartSeries").load(
{
params:{ queryId:queryId },
callback:function(){
bChartArr[1] = true;
}
});
//加載圖表樣式
Ext.getStore("ChartStyle").load(
{
params:{ queryId:queryId },
callback:function(){
bChartArr[2] = true;
}
});
// 按鈕
Ext.getStore("Buttons").load(
{
params:{query_id:queryId},
scope:this,
callback:function(){
bChartArr[3] = true;
}
});
var me = this;
// 等待所有的Storoe加載完成后執(zhí)行
var timer = setInterval(function(){
if(bChartArr[0] && bChartArr[1] && bChartArr[2] && bChartArr[3]){
clearInterval(timer); // 清除等待
// 解析圖表樣式、軸、序列動態(tài)生成圖表
me.createChartPanel();
}
},100);
這樣就有效的解決了Ext多個異步加載的store的同步問題。
說明:這里使用了數(shù)組來判斷數(shù)據(jù)是否加載完成。其實另外兩個方法應該也是可以的:
var timeIntervalNumber = 1;
var timeInterval = setInterval('doSomething()', 1000);
function doSomething() {
if (timeIntervalNumber % 2) {...}
if (timeIntervalNumber % 5) {...}
timeIntervalNumber ++;
if (timeIntervalNumber >= 2 * 5) {
timeIntervalNumber = 1;
}
}
var firstInterval;
var secondInterval;
function firstAlert(){
if(firstInterval) clearInterval(firstInterval);
<span style="white-space:pre"> </span>//處理所有
<span style="white-space:pre"> </span>.........
<span style="white-space:pre"> </span>firstInterval = setInterval('firstAlert()', 1000*2);
}
function secondAlert(){
if(secondInterval) clearInterval(secondInterval);
<span style="white-space:pre"> </span>//處理所有
<span style="white-space:pre"> </span>.......
secondInterval = setInterval('secondAlert()', 1000*3);
}