HTML的页面显示:
1 <html lang="en">
2 <head>
3 <meta charset="UTF-8">
4 <title>Title</title>
5 <link href="show.css" rel="stylesheet" type="text/css">
6 </head>
7 <body>
8
9 <script src="text.js"></script>
10 <input id="inp" type="text" onclick="see()">
11
12 <button id="stop" onclick="end()">停止</button>
13 </body>
14 </html>
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>绑定onclick事件去触发函数调用
css输出框的大小设置
1 #inp{
2 200px;
3 height: 40px;
4 }
javascript 去具体实现函数及其调用:
1 function star() {
2 var time=new Date().toLocaleString(); //获得一个时间对象并转为字符串
3 var i=document.getElementById('inp'); //获取所需标签
4 i.value=time; //设置标签值
5 }
6 var clock; //定义一个全局变量
7 function see() {
8
9 if (clock==undefined){ //如果定时器为空就执行下面方法
10 star();
11 clock=setInterval(star,1000);
12 }
13 //若已经存在定时器则不执行任何操作
14 }
15
16 function end() {
17 clearInterval(clock); //清除定时调用函数
18 clock=undefined; //把定时器置为空
19
20 }