1
|
首先注意,setInterval与clearInterval都是直属于window对象的。 |
1、直接调用setInterval(即不通过函数调用)
1
2
3
4
5
6
7
8
9
10
|
<div id= "oDiv_showCurrTime0"
style= "border:1px solid black; height:20px;" ></div>
<script> var
dT = document.getElementById( "oDiv_showCurrTime0" );
//var inX = setInterval("funX()",1000); var
inX = setInterval(funX,1000); //setInerval直接使用时,这两种方法都可以
function
funX(){
var
dTime = new
Date();
dT.innerHTML = dTime.toLocaleTimeString()
}
</script> |
2、函数调用setInterval和clearnterval
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<div id= "oDiv_showCurrTime"
style= "border:1px solid black; height:20px;" ></div><button onclick= "startX()" >开始</button><button onclick= "stopX()" >停止</button>
<script> var
intX; //这个必须写在startX函数外或不写,stopX才有效。
function
startX(){
intX= setInterval(func,500) //通过函数调用setInterval时,第一个参数不可以用"func()"这种形式,只能直接用函数名
var
dT = document.getElementById( "oDiv_showCurrTime" );
function
func(){
var
dTime = new
Date();
dT.innerHTML = dTime.toLocaleTimeString()
}
} function
stopX(){
window.clearInterval(intX) //注意!如果var intX定义在startX内,则无法清除!
} </script> |
3、函数调用带有参数的setInterval
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<div id= "oDiv_showCurrTime"
style= "border:1px solid black; height:20px;" ></div><button onclick= "startX()" >开始</button><button onclick= "stopX()" >停止</button>
<script> var
intX; //这个必须不写或者写在startX函数外,stopX才有效。
var
arr = new
Array;
arr[0]= "rrr"
function
startX(){
//intX= setInterval(func("rrr"),500) 这种方法是错误的。如果需要调用带参数的函数,直接使用func("rrr")会在第一次加载后,提示参数无效
intX= setInterval( function (){func.apply( this ,arr)},500) //apply参数问题请查资料
function
func(a){
var
dT = document.getElementById( "oDiv_showCurrTime" );
var
dTime = new
Date();
dT.innerHTML = a + dTime.toLocaleTimeString()
}
} function
stopX(){
window.clearInterval(intX) //注意!如果var intX定义在startX内,则无法清除!
} </script>
|