急！！！求高手解答JavaScript实时显示Ajax获取的服务器时间的倒计时功能。
0
悬赏园豆：50
[已解决问题]
解决于 2012-05-10 17:05
今有如下需求：
现已实现的功能：Ajax实时读取数据库数据，显示倒计时功能。每秒读一次数据库。
待实现功能：出于性能方面考虑，不能这样做。但是界面上的倒计时功能也要体现出“实时”性。所以客户端倒计时效果是实时变化的。目前提供的思路是：Ajax每15秒(这个时间可以自行设置)与数据库中的时间同步一次（目的减少服务器压力），但是客户端要用JavaScript来实时显示同步出来的服务器时间。请问js或jquery该怎么实现？或者哪位朋友有更好的建议？谢谢！
最佳答案
0
首先，非常感谢大家对此问题的关心。最终是一位同事帮忙解决的。目前这问题已经解决了80%。现将关键代码贴上。（代码看着可能有点让你蛋疼，请谅解。）
前台：
<script type="text/javascript">
var pd, wan = "a", ini = 0, jian = 1;
var tian = 99999, miao = 99999, fen = 99999, shi = 99999;
var diji = 0;
function ExecuteTime() {
if (ini == 0) {
wan = CompetitionMobileWeb.CompetitionMobileDJS.GetTime().value; //获取后台倒计时方法，并赋给一个变量
if (wan.indexOf("天") > 0) {
tian = parseInt(wan.split("离比赛结束还有：")[1].toString().split("天")[0].toString());
if (wan.indexOf("时") > 0) {
shi = parseInt(wan.split("天")[1].toString().split("时")[0].toString());
}
else {
}
fen = parseInt(wan.split("时")[1].toString().split("分")[0].toString());
miao = parseInt(wan.split("分")[1].toString().split("秒")[0].toString());
}
else {
if (wan.indexOf("时") > 0) {
shi = parseInt(wan.split("离比赛结束还有：")[1].toString().split("时")[0].toString());
fen = parseInt(wan.split("时")[1].toString().split("分")[0].toString());
miao = parseInt(wan.split("分")[1].toString().split("秒")[0].toString());
}
else {
if (wan.indexOf("分") > 0) {
fen = parseInt(wan.split("离比赛结束还有：")[1].toString().split("分")[0].toString());
miao = parseInt(wan.split("分")[1].toString().split("秒")[0].toString());
}
else {
if (wan.indexOf("秒") > 0) {
miao = parseInt(wan.split("离比赛结束还有：")[1].toString().split("秒")[0].toString());
}
}
}
}
var messageExceedTime = "比赛结束";
//调用时需加上命名空间
var message = CompetitionMobileWeb.CompetitionMobileDJS.GetTime().value; //获取后台倒计时方法
//倒计时
document.getElementById("timeover").innerHTML = message;
if (message == messageExceedTime) {
return;
}
ini = ini + 1;
jian = 1;
diji++;
}
else {
if (miao - 1 < 0) {
if (fen == 99999) {
miao = 99999;
}
else {
miao = 59;
if (fen - 1 < 0) {
if (shi == 99999) {
fen = 99999;
}
else {
fen = 59;
if (shi - 1 < 0) {
if (tian == 99999) {
shi = 99999;
}
else {
shi = 23;
if (tian - 1 < 0) {
tian = 99999;
}
else {
tian = tian - 1;
}
}
}
else {
shi = shi - 1;
}
}
}
else {
fen = fen - 1;
}
}
}
else {
miao = miao - 1;
}
var tian1 = tian == 99999 ? "" : tian + "天";
var shi1 = shi == 99999 ? "" : shi + "时";
var fen1 = fen == 99999 ? "" : fen + "分";
var miao1 = miao == 99999 ? "" : miao + "秒";
//alert(shi1);
var bianliang = "离比赛结束还有：" + tian1 + shi1 + fen1 + miao1;
if (bianliang == "离比赛结束还有：") {
bianliang = "比赛结束";
}
document.getElementById("timeover").innerHTML = bianliang;
++ini;
if (ini == 6) {
ini = 0;
}
}
setTimeout("ExecuteTime()", 1000);
}
</script>
<body onload="ExecuteTime()">
<form runat="server" id="form1" >
<div id="timeover"></div>
</form>
</body>
后台：
protected void Page_Load(object sender, EventArgs e)
{
//CompetitionMobileDJS这个是你的页面名称，前台调用的时候需要这样使用： 命名空间.类名.方法名
//如 前台的这个 var message = CompetitionMobileWeb.CompetitionMobileDJS.GetTime().value;
AjaxPro.Utility.RegisterTypeForAjax(typeof(CompetitionMobileDJS));
if (!IsPostBack)
{
}
}
DateTime dtm;
static DateTime Endtime = DateTime.Now.AddSeconds(3610);
[AjaxPro.AjaxMethod(AjaxPro.HttpSessionStateRequirement.ReadWrite)]
public string GetTime()
{
dtm = DateTime.Now;
if (dtm.CompareTo(Endtime) >= 0)
{
return "比赛结束";
}
else
{
TimeSpan ts = Endtime - dtm;
string returnvalue = string.Empty;
if (ts.Days > 0)
{
returnvalue += ts.Days.ToString() + "天";
}
if (ts.Hours >= 0)
{
returnvalue += ts.Hours.ToString() + "小时";
}
if (ts.Minutes >= 0)
{
returnvalue += ts.Minutes.ToString() + "分";
}
if (ts.Seconds >= 0)
{
returnvalue += ts.Seconds.ToString() + "秒";
}
return "离比赛结束还有：" + returnvalue;
}
}
此外，你需要引入Ajax.dll、AjaxPro.dll 到你的项目中。
其他回答(4)
0
那种团购秒杀什么的都是Get请求过一次页面就在本地js上一直
setInterval了没必要15秒就和服务器对一次时间吧。。。反正计算机只有每5秒的平均才真正接近实际时间的1秒没必要搞那么复杂
收获园豆：15
兄弟，这个对时间很有要求的，只能核对服务器时间，因为客户端时间是可以修改的。
0
为什么要读数据库呐？客户端的时间能改，服务器时间他们改不了。后台方法里的取服务器时间，用ajax调用后台方法，不用读数据库。没压力。
收获园豆：5
好吧，兄弟说的正确，不用每次都读取数据库，数据库只读一次就可以。然后，ajax要实时同服务器通讯，这样服务器压力也不小吧？现在需求是每15秒与服务器时间同步一下，但是在客户端显示时间时，要“实时”显示，而这个实时效果我打算用js来实现。但是我不知道如何实现。
0
没有必要这么频繁的和服务器对时，而且http不是对时的协议，不能保证时间上的准确性，至于说客户端改时间的问题，这个只需要在服务器端核对请求的时间就好了。一定要精准对时的话，那你需要用NTP。
收获园豆：10
0
是只需要 打開頁面的時候，初始化一個倒計時就可以了。只需要提交的時候，再去和服務器比較。要小於等於服務器的時間。
收获园豆：15
老大，这个不需要提交什么数据，只做显示功能。而且必须要与服务器同步， 我们可以延长与服务器同步的间隔时间，比如说15秒同步一次，然后在这15秒内呢，客户端的倒计时仍能“正常”显示(每秒都变化)，而不是“静止的”，过了15秒后再变化。（这种效果能否用js实现）。谢谢
@Technology: 你倒計時 完了。不是要做處理嗎？不需要提交到服務器嗎？
@Technology: 你要15秒同步一次 是怕他15秒内就会有很大的误差么。setinterval settimeout的误差真心没那么大。。 小查了一下http://blog.chinabyte.com/a/2636162.html这个应该能解除你的顾虑
