ASP网页上的倒计时代码,要求可以防刷新的

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ASP网页上的倒计时代码,要求可以防刷新的相关的知识,希望对你有一定的参考价值。

要求网站上倒计时器可以循环,比如倒计时30秒,29.,28,。。。。0。然后又重新从30秒开始倒计时。并且可以不因访问者的刷新页面而中断倒计时的进程导致重新开始计时。具有防刷新功能,支持ASP语言上使用

<script type="text/javascript" language="javascript">
var target = []
var time_id = []
/*
原理:每次和当前时间比较,得到天、小时、分、秒
*/
function show_date_time_0()
setTimeout("show_date_time_0()", 1000);
for (var i = 0, j = target.length; i < j; i++)
today = new Date();
//alert(today);
//计算目标时间与当前时间间隔(毫秒数)
var timeold = target[i] - today.getTime(); //getTime 方法返回一个整数值,这个整数代表了从 1970 年 1 月 1 日开始计算到 Date 对象中的时间之间的毫秒数。

//计算目标时间与当前时间的秒数
var sectimeold = timeold / 1000;

//计算目标时间与当前时间的秒数(整数)
var secondsold = Math.floor(sectimeold);

//计算一天的秒数
var msPerDay = 24 * 60 * 60 * 1000;

//得到剩余天数
var e_daysold = timeold / msPerDay;

//得到剩余天数(整数)
var daysold = Math.floor(e_daysold);
//alert(daysold);
//得到剩余天数以外的小时数
var e_hrsold = (e_daysold - daysold) * 24;
//得到剩余天数以外的小时数(整数)
var hrsold = Math.floor(e_hrsold);

//得到尾剩余分数
var e_minsold = (e_hrsold - hrsold) * 60;
//得到尾剩余分数(整数)
minsold = Math.floor((e_hrsold - hrsold) * 60);

//得到尾剩余秒数(整数)
seconds = Math.floor((e_minsold - minsold) * 60);
if (daysold < 0)
document.getElementById(time_id[i]).innerhtml = "逾期,倒计时已经失效";

else
//天数取三位,不足时前边补0
if (daysold < 10) daysold = daysold
//天数取三位,不足时前边补0
if (daysold < 100) daysold = daysold

//小时取两位,不足补0
if (hrsold < 10) hrsold = "0" + hrsold
//分数取两位,不足补0
if (minsold < 10) minsold = "0" + minsold
//秒数取两位,不足补0
if (seconds < 10) seconds = "0" + seconds

//小于三天时,字体为红色
if (daysold < 1)
document.getElementById(time_id[i]).innerHTML = "<span class=\"hz\">" + hrsold + "</span>小时<span class=\"hz\">" + minsold + "</span>分<span class=\"hz\">" + seconds + "</span>秒";

else
document.getElementById(time_id[i]).innerHTML = "<span class=\"hz\">" + daysold + "</span>天<span class=\"hz\">" + hrsold + "</span>小时<span class=\"hz\">" + minsold + "</span>分<span class=\"hz\">" + seconds + "</span>秒"





setTimeout("show_date_time_0()", 1000);
</script>
<script type="text/javascript">
//使用方式
target[target.length]=new Date(2011, 1, 28, 00, 00, 00).getTime();
time_id[time_id.length] = "timecount"

</script>
参考技术A 用js实现就很就很简单
<SCRIPT LANGUAGE="JavaScript">
<!--
var maxtime;
if(window.name=='')
maxtime = 60*60;
else
maxtime = window.name;

function CountDown()
if(maxtime>=0)
minutes = Math.floor(maxtime/60);
seconds = Math.floor(maxtime%60);
msg = "距离结束还有"+minutes+"分"+seconds+"秒";
document.all["timer"].innerHTML = msg;
if(maxtime == 5*60) alert('注意,还有5分钟!');
--maxtime;
window.name = maxtime;

else
clearInterval(timer);
alert("时间到,结束!");


timer = setInterval("CountDown()",1000);
//-->
</SCRIPT>
<div id="timer" style="color:red"></div>追问

您好啊,您这个代码挺有用,具有防刷新功能,但是为什么每个用户进去都是从30秒开始算呢?能否实现倒计时和服务器时间相关联的自动循环倒计时,不要因为不同用户的登录又重新自动开始计时?

追答

js获取的是客户端的时间,所以每次都是从三十秒开始的,如果你想使显示与服务器端相关联的倒计时,那么你就得获取服务器端的时间,你可以从网上下载代码,自己改一下……

本回答被提问者采纳
参考技术B 很简单啊 设置S时间 参考技术C 这个应该不难吧,asp可以使用session追问

能说具体点吗?或者是有没有具体的代码?

追答

其它的几位的JS代码都可用,如果你要每个地方都一样的话最好去研究一下淘宝的聚划算

我的想法是使用Application,你可以查一下asp Application的使用方法,应该可以满足你

倒计时防刷新功能

原理很简单:页面加载的时候会从cookie中获取值,如果获取不到就设定一个值,然后存入cookie中,设置一个定时器,每秒存入cookie一次,页面刷新的时候会从cookie中获取存入的值,直到时间为0

当然你也可以使用localShortage存储

下面是代码

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
 2 <html xmlns="http://www.w3.org/1999/xhtml">  
 3 <head>  
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
 5     <title>time remaining</title>  
 6     <script src="~/Scripts/jquery-1.10.2.js"></script>
 7 </head>  
 8 
 9 <body>
10     剩余时间:<span id="timer"></span><br />
11     <br />
12     <script type="text/javascript">
13         /*主函数要使用的函数,进行声明*/
14         var clock = new clock();
15         /*指向计时器的指针*/
16         var timer;
17         window.onload = function () {
18             /*主函数就在每1秒调用1次clock函数中的move方法即可*/
19             timer = setInterval("clock.move()", 1000);
20         }
21         function clock() {
22             /*s是clock()中的变量,非var那种全局变量,代表剩余秒数*/
23             //防止页面刷新,将秒数存入cookie
24             if (getCookie("maxtime") == "") {
25                 //60分*60秒,用户可以自己定义
26                 this.s = 60 * 60;
27             }
28             else {
29                 this.s = getCookie("maxtime");
30             }
31             this.move = function () {
32                 /*输出前先调用exchange函数进行秒到分秒的转换,因为exchange并非在主函数window.onload使用,因此不需要进行声明*/
33                 document.getElementById("timer").innerHTML = exchange(this.s);
34                 if (this.s > 0) {
35                     this.s = this.s - 1;
36                     document.cookie = "maxtime=" + encodeURI(this.s);
37                 }
38                 else {
39                     alert("时间到");
40                     //停止setInterval
41                     clearInterval(timer);
42                     //清除cookie
43                     //setCookie("maxtime", encodeURI(this.s), -1);
44                 }
45             }
46         }
47         //时间转换
48         function exchange(time) {
49             /*javascript的除法是浮点除法,必须使用Math.floor取其整数部分*/
50             this.m = Math.floor(time / 60);
51             /*存在取余运算*/
52             this.s = (time % 60);
53             this.text = this.m + "" + this.s + "";
54             /*传过来的形式参数time不要使用this,而其余在本函数使用的变量则必须使用this*/
55             return this.text;
56         }
57         //读Cookie,返回值为相应Cookie的内容
58         function getCookie(cookieName) {
59             var cookieContent = ‘‘;
60             var cookieAry = document.cookie.split("; ");//得到Cookie数组
61             for (var i = 0; i < cookieAry.length; i++) {
62                 var temp = cookieAry[i].split("=");
63                 if (temp[0] == cookieName) {
64                     cookieContent = decodeURI(temp[1]);
65                 }
66             }
67             return cookieContent;
68         }
69         function setCookie(name, value, seconds) {
70             if (!seconds) {
71                 seconds = 24 * 60 * 60;//24小时*60分*60秒
72             }
73             var exp = new Date();
74             exp.setTime(exp.getTime() + seconds * 1000);
75             document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();
76         }
77     </script>
78 </body>
79 </html>  

 

   

以上是关于ASP网页上的倒计时代码,要求可以防刷新的的主要内容,如果未能解决你的问题,请参考以下文章

如何在asp页面上做一个倒计时?

倒计时防刷新功能

Jquery 插件防刷新 60秒倒计时

Jquery插件 防刷新倒计时 “点击获取验证码后60秒内禁止重新获取

js倒计时防页面刷新

求php倒计时代码