效果: 顯示當前時間,自動增長 添加按鈕的計時器(用於開始和暫停) 效果: 點擊開始按鈕,從0計數,一秒加1。點擊按鈕停止,保持當前狀態。 總結: 1、setInterval(代碼,交互時間); 參數:代碼:可以是函數名或代碼串;交互時間:設置交互時間 clearInterval(id_from_s ...
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>自動增長計時器</title> <script type="text/javascript"> var atime; function clock(){ var time=new Date(); atime=time.getHours()+":"+time.getMinutes()+":"+time.getSeconds(); document.getElementById("clock").value = atime; } setInterval(clock,1000); </script> </head> <body> <form> <input type="text" id="clock" size="50" style="background:#000;color:#00ff00;width:55px"; /> </form> </body> </html>
效果:
顯示當前時間,自動增長
添加按鈕的計時器(用於開始和暫停)
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>計時器</title> <script type="text/javascript"> var num=0; var i; function startCount(){ document.getElementById('count').value=num; num=num+1; i=setTimeout("startCount()",1000); } function stopCount(){ clearTimeout(i); } </script> </head> <body> <form> <input type="text" id="count" /> <input type="button" value="Start" onclick="startCount()"/> <input type="button" value="Stop" onclick="stopCount()" /> </form> </body> </html>
效果:
點擊開始按鈕,從0計數,一秒加1。點擊按鈕停止,保持當前狀態。
總結:
1、setInterval(代碼,交互時間);
參數:代碼:可以是函數名或代碼串;交互時間:設置交互時間
clearInterval(id_from_setInterval);
參數:由setInterval() 返回的 ID 值。
2、setTimeout(代碼,延遲時間);
參數:代碼: 可以是函數名或代碼串;延遲時間:設置延遲時間
clearTimeout(id_from_setTimeout);
參數:由setTimeout()返回的ID值。