倒计时JS怎么让它到00:00:00,计时器就停了呢?我做出来的会停止,可是刷新下又走到负数去了,求救~~~
倒计时我做好了,就是到最后00:00:00,计时器停止了,可为什么刷新一下,计时器就成负数依然在走啊??大神,帮帮忙啊~~~<style>*{margin:0;paddi...
倒计时我做好了,就是到最后00:00:00,计时器停止了,可为什么刷新一下,计时器就成负数依然在走啊??大神,帮帮忙啊~~~
<style>
*{margin:0; padding:0}
ul{margin:10px auto; overflow:hidden; width:120px; border:#cccccc solid 1px;}
li{list-style:none; float:left;/* margin-left:5px;*/ /* width:50px; */ line-height:26px; text-align:center}
li:nth-child(1){border:none}
ul .box4{border:none;}
ul .box5{border:none; margin-left:0}
ul .box6{border:none; margin-left:0}
.hezi1{ width:100px; height:20px; background-color:#00F; margin-right:auto; margin-left:auto;}
.hezi2{ width:100px; height:20px; background-color: #0F0; margin-right:auto; margin-left:auto; display:none}
</style>
<body>
<ul>
<li class="box4"></li>
<li class="box5"></li>
<li class="box6"></li>
</ul>
<div class="hezi1"></div>
<div class="hezi2"></div>
<script src="js/jquery.js"></script>
<script>
function diaoyong(){
var test =new Date()
x=test.getHours()
f=test.getMinutes()
m=test.getSeconds()
var xx=17
ff=22
mm=59
xxx=xx-x
fff=ff-f
mmm=mm-m
}
diaoyong()
function ting(){
if(xxx==0&&fff==0&&mmm==0){
$(".hezi1").hide();
$(".hezi2").show();
diaoyong = clearInterval;
ting = stop ;
}
else{
setInterval(function(){diaoyong()
if(xxx<10){$(".box4").text("0"+xxx+":")}else{$(".box4").text(xxx+":")}
if(fff<10){$(".box5").text("0"+fff+":")}else{$(".box5").text(fff+":")}
if(mmm<10){$(".box6").text("0"+mmm)}else{$(".box6").text(mmm)}
},500);
}}
setInterval(function(){ting()});
</script>
</body> 展开
<style>
*{margin:0; padding:0}
ul{margin:10px auto; overflow:hidden; width:120px; border:#cccccc solid 1px;}
li{list-style:none; float:left;/* margin-left:5px;*/ /* width:50px; */ line-height:26px; text-align:center}
li:nth-child(1){border:none}
ul .box4{border:none;}
ul .box5{border:none; margin-left:0}
ul .box6{border:none; margin-left:0}
.hezi1{ width:100px; height:20px; background-color:#00F; margin-right:auto; margin-left:auto;}
.hezi2{ width:100px; height:20px; background-color: #0F0; margin-right:auto; margin-left:auto; display:none}
</style>
<body>
<ul>
<li class="box4"></li>
<li class="box5"></li>
<li class="box6"></li>
</ul>
<div class="hezi1"></div>
<div class="hezi2"></div>
<script src="js/jquery.js"></script>
<script>
function diaoyong(){
var test =new Date()
x=test.getHours()
f=test.getMinutes()
m=test.getSeconds()
var xx=17
ff=22
mm=59
xxx=xx-x
fff=ff-f
mmm=mm-m
}
diaoyong()
function ting(){
if(xxx==0&&fff==0&&mmm==0){
$(".hezi1").hide();
$(".hezi2").show();
diaoyong = clearInterval;
ting = stop ;
}
else{
setInterval(function(){diaoyong()
if(xxx<10){$(".box4").text("0"+xxx+":")}else{$(".box4").text(xxx+":")}
if(fff<10){$(".box5").text("0"+fff+":")}else{$(".box5").text(fff+":")}
if(mmm<10){$(".box6").text("0"+mmm)}else{$(".box6").text(mmm)}
},500);
}}
setInterval(function(){ting()});
</script>
</body> 展开
展开全部
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RunJS 演示代码</title>
<style>
* {
margin: 0;
padding: 0
}
ul {
margin: 10px auto;
overflow: hidden;
width: 120px;
border: #cccccc solid 1px;
}
li {
list-style: none;
float: left;
line-height: 26px;
text-align: center
}
li:nth-child(1) {
border: none
}
ul .box4 {
border: none;
}
ul .box5 {
border: none;
margin-left: 0
}
ul .box6 {
border: none;
margin-left: 0
}
.hezi1 {
width: 100px;
height: 20px;
background-color: #00F;
margin-right: auto;
margin-left: auto;
}
.hezi2 {
width: 100px;
height: 20px;
background-color: #0F0;
margin-right: auto;
margin-left: auto;
display: none
}
</style>
<script id="jquery_180" type="text/javascript" class="library" src="/js/sandbox/jquery/jquery-1.8.0.min.js"></script>
<script>
// 入口函数
$(document).ready(function() {
countdown();
});
// 定义结束时间和计时对象
var end = new Date("1111/1/1 17:22:59"),
timeout;
// 倒计时方法
var countdown = function() {
var now = new Date;
var dh = Math.abs(now.getHours() - end.getHours());
var dm = Math.abs(now.getMinutes() - end.getMinutes());
var ds = Math.abs(now.getSeconds() - end.getSeconds());
if (dh == 0 && dm == 0 && ds == 0) {
$(".hezi1").hide();
$(".hezi2").show();
clearTimeout(timeout);
return;
}
dh = dh < 10 ? "0" + dh : dh;
dm = dm < 10 ? "0" + dm : dm;
ds = ds < 10 ? "0" + ds : ds;
$(".box4").text(dh);
$(".box5").text(":" + dm);
$(".box6").text(":" + ds);
timeout = setTimeout(countdown, 1000);
}
</script>
</head>
<body>
<ul>
<li class="box4"></li>
<li class="box5"></li>
<li class="box6"></li>
</ul>
<div class="hezi1"></div>
<div class="hezi2"></div>
</body>
</html>
追问
大神,你这串代码停止之后再刷新下怎么还会出现倒计时呀,好像没有真正意义上的停止?而且是停止在00:00:01上,怎么不能停在00:00:00上呢?求救~
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询