JavaScript中的setInterval()和setTimeout()
阿新 • • 發佈:2018-12-27
1.setlnterval()
setInterval() 方法可按照指定的週期(以毫秒計)來呼叫函式或計算表示式。
setInterval() 方法會不停地呼叫函式,直到 clearInterval() 被呼叫或視窗被關閉。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的引數。
setInterval(code,millisec[,"lang"])
例項:
<html> <body> <input type="text" id="clock" size="35" /> <script language=javascript> var int=self.setInterval("clock()",50) function clock() { var t=new Date() document.getElementById("clock").value=t } </script> </form> <button onclick="int=window.clearInterval(int)"> Stop interval</button> </body> </html>
2.setTimeout()
setTimeout() 方法用於在指定的毫秒數後呼叫函式或計算表示式。
setTimeout(code,millisec)
例項:
<html> <head> <script type="text/javascript"> function timedMsg() { var t=setTimeout("alert('5 seconds!')",5000) } </script> </head> <body> <form> <input type="button" value="Display timed alertbox!" onClick="timedMsg()"> </form> <p>Click on the button above. An alert box will be displayed after 5 seconds.</p> </body> </html>
例項:
<script> function load() { //第一個圖表 var myChart1 = echarts.init(document.getElementById('change-echarts1')); var app = { xday:[], yvalue:[] }; // 傳送ajax請求,從後臺獲取json資料 $(document).ready(function () { getData(); console.log(app.xday); console.log(app.yvalue); }); function getData() { $.ajax({ url:'echarts', data:{}, type:'get', dataType:'json', success:function(result) { alert(result.yvalues); app.xday = result.xdays; app.yvalue = result.yvalues; myChart1.setOption({ title: { text: 'PH資料變化情況' }, tooltip: {}, legend: { data:['PH'] }, xAxis: { data: app.xday }, yAxis: {}, series: [{ name: 'PH', type: 'line', data: app.yvalue }] }) }, error:function (msg) { console.log(msg); alert('系統發生錯誤'); } }) }; t = setTimeout("load()",5000); }; </script>
3.onload事件
onload 事件會在頁面或影象載入完成後立即發生。
<html>
<head>
<script type="text/javascript">
function load()
{
window.status="Page is loaded"
}
</script>
</head>
<body onload="load()">
</body>
</html>