本文实例为大家分享了js实现简单的秒表具体代码,供大家参考,具体内容如下
<强>描述:
实现一个简单的秒表,点击启动按钮时开始计时,随后启动按钮变为暂停,
点击暂停暂停计时,点击复位回到最初始状态。
<>强效果:
<强>代码:
& lt; !DOCTYPE html>
& lt; html lang=癳n”比;
& lt; head>
& lt;元charset=皍tf - 8”比;
& lt; title> Title
& lt; style>
# showTime
{
宽度:300 px;
高度:60 px;
字体大小:60 px;
行高:60 px;
}
& lt;/style>
& lt;/head>
& lt; body>
& lt; div>
& lt; div id=" showTime "祝辞00:00:00
& lt;按钮id=" startBn "祝辞启动& lt;/button>
& lt;按钮id=" restBn "祝辞复位& lt;/button>
& lt;/div>
& lt; script>//- - - - - -
var时间、showTime startBn、restBn pauseDate;//布尔开关
var bool=false;//暂停的累计时间
var pauseTime=0;
init ();
init()函数{
showTime=. getelementbyid (“showTime”);
startBn=. getelementbyid (“startBn”);
restBn=. getelementbyid (“restBn”);
startBn.addEventListener(“点击”,clickHandler);//开始按钮~暂停按钮
restBn.addEventListener(“点击”,clickHandler);//复位按钮
setInterval(动画、16);
}//转化时间函数
函数动画(){
如果(! bool)返回;//前时间减去上次开启时间减去暂停累计时间
var倍=new日期().getTime () -time-pauseTime;
var分钟=Math.floor(次/60000);//毫秒转化为分钟
var秒=Math.floor((乘以分钟* 60000)/1000);//已知分钟
将时间减去分钟除1000年去得出秒
var=Math.floor女士((乘以分钟* 60000 -秒* 1000)/10);//showTime.innerHTML=(minutes<& # 63;“0”+分钟:分钟)+”:“
+ (seconds<& # 63;“0”+秒:秒)+”:“
+ (ms<& # 63;“0”+女士:女士);
}//点击时的事件
函数clickHandler (e) {
e=e | | window.event;
如果(这===startBn) {
bool=! bool;
如果(bool) {
this.innerHTML="暂停”;//如果我们上一次暂停时间是空,表示没有暂停过,因此,直接返回0//如果上次的暂停时间是有值得,用当前毫秒数减去上次的毫秒数,这样就会得到暂停时间
pauseTime +=(!pauseDate & # 63;0:新日期().getTime () -pauseDate);
如果(时间)返回;
时间=new日期().getTime ();
返回;//是为bool判断跳出
}
this.innerHTML="启动”;
.getTime pauseDate=new日期()();
返回;//是为这是否等于startBn判断跳出
}
startBn.innerHTML="启动”;
pauseTime=0;
pauseDate=零;
bool=false;
时间=0;
showTime.innerHTML="就是";
}
& lt;/script>
& lt;/body>
& lt;/html>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
