js简单时分秒计时器(转载)
标签:
JavaScript
<div style="text-align: center"> <input type="text" id="timetext" value="00时00分00秒" readonly><br> <span id="_h">00时</span> <span id="_m">00分</span> <span id="_s">00秒</span> <button type="button" onclick="start()">开始</button> <button type="button" onclick="stop()">暂停</button> <button type="button" onclick="Reset()">重置</button> </div>
// 初始值
var h=m=s=0;
var init;
function timers(){
s=s+1;
if(s>=60){
s=00;
m=m+1
}
if(m>=60){
m=00;
h=h+1;
}
// input value 表现
document.getElementById('timetext').value= `${h<10?('0'+h):h}时${m<10?('0'+m):m}分${s<10?('0'+s):s}秒`;
// 标签 表现
document.getElementById('_h').innerHTML=`${h<10?('0' + h):h}时`
document.getElementById('_m').innerHTML=`${m<10?('0' + m):m}分`
document.getElementById('_s').innerHTML=`${s<10?('0' + s):s}秒`
}
// 开始计时器
function start(){
init = setInterval(timers,1000)
}
// 重置计时器
function Reset(){
window.clearInterval(init)
h=m=s=0;
document.getElementById('timetext').value= "00时00分00秒";
document.getElementById('_h').innerHTML='00时'
document.getElementById('_m').innerHTML='00分'
document.getElementById('_s').innerHTML='00秒'
}
// 暂停计时器
function stop(){
window.clearInterval(init)
}点击查看更多内容
2人点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦