在javascript中利用 setInterval clearInterval定时 方法去控制显示时间的增加
1 <!DOCTYPE html>
2 <html>
3
4 <head>
5 <meta charset="UTF-8">
6 <title>页面时钟</title>
7 <script type="text/javascript" src="js/jquery-3.2.1.js"></script>
8 </head>
9
10 <body>
11 <!--<input type="button" id="button1"value="OK" />
12 <img src="img/00000.jpg" />-->
13 <!--添加一个文本框显示时间，两个按钮去控制时间的开始和暂停-->
14 <input type="text" size="30" id="one" /><br />
15 <input type="button" id="two" value="开始" onclick="fun1()" />
16 <input type="button" id="three" value="结束" onclick="fun2()" />
17
18 </body>
19
20 </html>
21 <script type="text/javascript">
22 //控制文本框中的内容
23 // document.getElementById("one").value="123";
24 var id;
25
26 function fun1() {
27 //确保只打开一个定时器
28 setTime();
29
30 if(!id) {
31
32 id = window.setInterval(setTime, 1000);
33 }
34 }
35
36 function setTime() {
37 var date = new Date();
38 document.getElementById("one").value = date.toLocaleString();
39 }
40 //停止时钟
41 function fun2() {
42
43 clearInterval(id);
44 id = undefined;
45 }
46 </script>
时间： 2024-08-01 00:49:34