js倒计时器可自定义时间和暂停，效果如下，点击start 开始计时，end结束计时

分别复制 H5 css js 代码即可实现，具体的算法在js控制函数中(都写了注释)

css

html,body{

width:100%;height:100%;

}

.content{

height:100%;width:100%;

}

.row-center{

display:flex;flex-direction:row;justify-content:center;

align-items:center;

}

.tc-input-style{

outline:none;border:none;width:20%;height:80%;border-radius:10px;

}

.tc-span-style{

width:30%;height:100%;font-weight:bold;

}

.tc-font-style{

font-size:15px;font-weight:bold;

}

.tc-div-style1{

height:33%;width:100%

}

.tc-div-style0{

height:30%;width:100%

}

.tc-div-style2{

height:10%;width:100%;

}

.tc-div-style3{

height:100%;width:30%

}

.column-center{

display:flex;flex-direction:column;justify-content:center;

align-items:center;

}

.column-start-center{

display:flex;flex-direction:column;justify-content:flex-start;

align-items:center;

}

#timecount{

height:50%;width:20%;

}

.button-style-0{

border-radius:10px;

}

.row-space-around{

display:flex;flex-direction:row;justify-content:space-around;

align-items:center;

}

h5

记得引入jq

JS

var timecount;//定义一个全局变量

function timer(intDiff){

//定义一个循环函数每一秒定时执行

timecount=setInterval(function(){

var hour=0,

minute=0,

second=0;//初始化时间默认值

//算法控制

if(intDiff > 0){

hour = Math.floor(intDiff / (60 * 60)) ;

minute = Math.floor(intDiff / 60) - (hour * 60);

second = Math.floor(intDiff) - (hour * 60 * 60) - (minute * 60);

}

if (minute <= 9) minute = '0' + minute;

if (second <= 9) second = '0' + second;

//打印到dom

$('#hour_show').html(''+hour+'时');

$('#minute_show').html(''+minute+'分');

$('#second_show').html(''+second+'秒');

intDiff--;

}, 1000);

console.log(intDiff);

}

function timecounts(){

console.log($("#hour_count").val())

count=parseInt($("#hour_count").val()*3600)+parseInt($("#minute_count").val()*60)+parseInt($("#second_count").val())

timer(count);//调用计时器函数

console.log(count);

}

function timestop(){

var hour= $("#hour_show").text();

var minute= $("#minute_show").text();

var second= $("#second_show").text();

var time=parseInt($("#hour_show").text())*3600+parseInt($("#minute_show").text())*60+parseInt($("#second_show").text())

console.log(time);

timecount=window.clearInterval(timecount);//停止计时器

}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。