代码
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery实现倒计时效果</title>
<script language="javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
var SysSecond;
var InterValObj;
$(document).ready(function() {
SysSecond = parseInt($("#remainSeconds").html()); //这里我是在服务端算好了剩余的秒数，并保存到客户端，如果过期则返回0
InterValObj = window.setInterval(SetRemainTime, 1000); //间隔函数，1秒执行
});
//代理,接单的时间+1小时减去当前时间的秒数
function SetRemainTime() {
if (SysSecond > 0) {
//alert(SysSecond);
SysSecond = SysSecond - 1;
var second = Math.floor(SysSecond % 60); // 计算秒
var minite = Math.floor((SysSecond / 60) % 60); //计算分
var hour = Math.floor((SysSecond / 3600) % 24); //计算小时
var day = Math.floor((SysSecond / 3600) / 24); //计算天
$("#remainTime").html(day + "天" + hour + "小时" + minite + "分" + second + "秒");
} else {//剩余时间小于或等于0的时候，就停止间隔函数
window.clearInterval(InterValObj);
}
}
</script>
</head>
<body>
<div id="remainSeconds" style="display:none">18000</div>
<div id="remainTime" style="font-size:20px;font-weight:800;color:#FF9900"></div>
</body>
</html>
当我们在webservice里读取到数据库中的时间字段后，把时间分割判断。Javascript代码如下：
<script type="text/javascript" src ="jquery-1[1].2.6.js"></script>
<script type="text/javascript">
function Times() {
var tempTime=document.getElementById("currTime").innerHTML.split(":");
var hour=tempTime[0];
var minute=tempTime[1];
var second=tempTime[2];
if(second>=1)
{
second=(second-1>9)?(second-1):"0"+(second-1);
}
else
{
second="59";
if(minute>=1){
minute=(minute-1>9)?(minute-1):"0"+(minute-1);
}else{
minute="59";
if(hour>=1){
hour=(hour-1>9)?(hour-1):"0"+(hour-1);
}else{
minute="00";
hour="0"+0;
}
}
}
document.getElementById("currTime").innerHTML=hour+":"+minute+":"+second;
if(hour==0&&minute==0&&second==0)
{
document .getElementById ("currTime").style .display ="none";
}
else
setTimeout (Times,1000);
}
//当窗体加载是调用。相当于onload（）事件
(function gettime()
{
$.ajax({
contentType:"application/json",
type: "POST",
url: "WebService.asmx/Gettime",
data: "{'id':'1'}",
dataType: 'json',
success: function(msq){
document .getElementById ("currTime").innerHTML =msq.d ;
}
});
setTimeout (Times,1000) ；
})();
</script>
多个倒计时>>>
代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
</head>
<body>
<p>离一模还有<span id="_lefttime1" style="color:red;font-size:12pt;"></span></p>
<p>离二模还有<span id="_lefttime2" style="color:red;font-size:12pt;"></span></p>
<p>离高考还有<span id="_lefttime3" style="color:red;font-size:12pt;"></span></p>
</body>
</html>
<SCRIPT LANGUAGE="JavaScript">
function _fresh(){
var datalist =new Array();
datalist =[
[new Date("2010/10/1"), "_lefttime1"],
[new Date("2010/10/15"), "_lefttime2"],
[new Date("2010/10/2"), "_lefttime3"]
];
for(var i =0; i<datalist.length; i++){
var endtime =datalist[i][0];
var nowtime = new Date();
var leftsecond=parseInt((endtime.getTime()-nowtime.getTime())/1000);
if(leftsecond<0)leftsecond=0;
var __d=parseInt(leftsecond/3600/24);
document.getElementById(datalist[i][1]).innerHTML=__d+"天 ";
}
}
setInterval(_fresh,1000);
</SCRIPT>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· AI与.NET技术实操系列：基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 25岁的心里话
· 闲置电脑爆改个人服务器（超详细） #公网映射 #Vmware虚拟网络编辑器
· 零经验选手，Compose 一天开发一款小游戏！
· 因为Apifox不支持离线，我果断选择了Apipost！
· 通过 API 将Deepseek响应流式内容输出到前端
2006-09-26 ASP.NET中实现MSN通知消息功能！
2006-09-26 如何用多线程来实现ping多台机器？？