增加了一個“start”按鈕,如何實現點擊“start”按鈕后開始計時,而點擊“stop”按鈕后結束計時呢?下面的代碼實現不了,只能實現點擊“stop”結束計時,但點擊“start”只跳出一次時間,而無法繼續計時。。。請高手指點!謝謝!
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>計時器</title>
<script type="text/javascript">
? ?var i;
? ?function start(){
? ? ? var time=new Date(); ? ? ? ? ? ? ? ?
? ? ? document.getElementById("myclock").value = time;
// ? ? ?i=setInterval("start()",1000);?
? ?}
? ? i=setInterval("start()",1000);?
? ?function stop(){
// ? ?i=setInterval("start()",1000);
? ? ?clearInterval(i);
? ?}
</script>
</head>
<body>
? <form>
? ? <input type="text" id="myclock" size="50" ?/>
? ? <input type="button" value="Start" onclick="start()" />
? ? <input type="button" value="Stop" onclick="stop()" />
? </form>
</body>
</html>
2018-05-31
<!DOCTYPE?html><html> <head> <meta?charset="UTF-8"> <title></title> <style> html{ font-size:?100px; text-align:?center; } #clock,#stop,#start{ font-size:?1rem; height:?1rem; width:?90%; } </style> </head> <body> <input?id="clock"?size="50"?type="text"/> <button?type="button"?onclick="start();"?id="start"?style="font-size:?0.6rem;">開始</button> <button?type="button"?onclick="stop();"?id="stop"?style="font-size:?0.6rem;">暫停</button> <script?type="text/javascript"> var?mystr="Hello?World!"; document.write(mystr.substr(-1,6)??+?"<br?/>"); document.write(mystr.substr(0,5)???+?"<br?/>");// var?int=setInterval(clock,?100)// function?clock(){// ????var?time=new?Date();// ????document.getElementById("clock").value?=?time;// } ??var?attime; ??var?timer; ??function?clock(){ ????var?time=new?Date();?????????? ????attime=time.getHours()+":"+time.getMinutes()+":"+time.getSeconds(); ????document.getElementById("clock").value?=?attime; ??} ??timer?=?setInterval(clock,1000);?//注意這里函數clock?為參數,只寫函數名 ??function?stop(){ ?? clearInterval(timer); ??} ??function??start(){ ?? timer?=?setInterval(clock,1000); ??} ? </script> </body></html>2018-05-29
<!DOCTYPE?HTML> <html> ????<head> ????????<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"> ????????<title>計時器</title> ????????<script?type="text/javascript"> ???????????function?clock(){ ?????????????????var?time=new?Date(); ?????????????????document.getElementById("clock").value?=?time; ???????????} ???????????var?i; ???????????function?start()?{ ??????????? i?=?setInterval("clock()",100); ???????????} ????????</script> ????</head> ????<body> ??????<form> ??????????<input?type="text"?id="clock"?size="50"??/> ??????????<input?type="button"?value="Start"?onclick="start()"?/> ??????????<input?type="button"?value="Stop"?onclick="clearInterval(i)"?/> ??????</form> ????</body> </html>2018-05-29
<!DOCTYPE?HTML><html><head><meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"><title>計時器</title><script?type="text/javascript">???function?clock(){??????var?time=new?Date();??????????????? ????????document.getElementById("clock").value?=?time;???}???var?i;???function?start()?{ i?=?setInterval("clock()",100);???}????</script></head><body>??<form>????<input?type="text"?id="clock"?size="50"??/>????<input?type="button"?value="Start"?onclick="start()"?/>????<input?type="button"?value="Stop"?onclick="clearInterval(i)"?/>??</form></body></html>2018-05-03
你這個代碼嵌套有問題吧
2018-04-27
貌似要用到下面講的setTimeout和clearTimeout才可以。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>計時器</title>
<script type="text/javascript">
? ?var i;
? ?function start(){
? ? ? var time=new Date(); ? ? ? ? ? ? ? ?
? ? ? document.getElementById("myclock").value = time;
? ? ? i=setTimeout("start()",1000);?
? ?}
// ? i=setTimeout("start()",1000);
? ?function stop(){
? ? ?clearTimeout(i);
? ?}
</script>
</head>
<body>
? <form>
? ? <input type="text" id="myclock" size="50" ?/>
? ? <input type="button" value="Start" onclick="start()" />
? ? <input type="button" value="Stop" onclick="stop()" />
? </form>
</body>
</html>