zoukankan      html  css  js  c++  java
  • setInterval 与 clearInterval详解

    首先注意,setInterval与clearInterval都是直属于window对象的。

    1、直接调用setInterval(即不通过函数调用)

    <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

    <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

    <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>
    
       
    

      

  • 相关阅读:
    02 树莓派的远程连接
    01 树莓派系统安装
    Python正课110 —— Django入门
    作业7 答案
    作业8
    作业7
    作业6
    文件操作
    字符编码
    基本数据类型之集合
  • 原文地址:https://www.cnblogs.com/hutuzhu/p/3523231.html
Copyright © 2011-2022 走看看