天天看點
傳回

js倒計時（擷取伺服器端時間）

前台頁面：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test4.aspx.cs" Inherits="test4" %>

<!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>
    <script type="text/javascript">
function show_date_time(time, element){
        window.setTimeout("show_date_time('"+time+"','" + element + "')", 1000);       
        BirthDay = new Date(time);
        //擷取用戶端目前時間（不符合現實需求）
        //today=new Date();
        //擷取伺服器目前時間
        if (window.ActiveXObject){
        http_request=new ActiveXObject('Microsoft.XMLHTTP');
        } else if (window.XMLHttpRequest) {
        http_request=new XMLHttpRequest();
        }
        http_request.open('HEAD', '.', false);//擷取伺服器時間，XHR不能跨域!!!
        http_request.send(null);
        var ServerDate = new Date(http_request.getResponseHeader('Date'));
       //document.write ("<br>伺服器時間："+ServerDate);
        var today=ServerDate ;
        timeold=(BirthDay.getTime()-today.getTime()); 
        sectimeold=timeold/1000 
        secondsold=Math.floor(sectimeold); 
        msPerDay=24*60*60*1000 
        e_daysold=timeold/msPerDay 
        daysold=Math.floor(e_daysold); 
        e_hrsold=(e_daysold-daysold)*24; 
        hrsold=Math.floor(e_hrsold); 
        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(element).innerHTML="0天0小時0分0秒";
        }else{
        document.getElementById(element).innerHTML=daysold+"天"+hrsold+"小時"+minsold+"分"+seconds+"秒" ;
        }
}
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:Label ID="lblStatus" runat="server" Text="Label"></asp:Label>
    <asp:Label ID="LabelTime" runat="server" Text=""></asp:Label>
    <script>show_date_time(('<%=panicTime %>'),'LabelTime')</script>
    </div>
    </form>
</body>
</html>

背景頁面：

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using mshopClass;


public partial class test4 : System.Web.UI.Page
{
    public string panicBuyStartTime = "";  //開始時間
    public string panicBuyEndTime = "";  //結束時間
    public string panicTime = "";  //倒計時間
    protected void Page_Load(object sender, EventArgs e)
    {
        BindShopDetail();
    }


    //擷取商品倒計時
    void BindShopDetail()
    {
        string sql = "select  panicBuyStartTime,panicBuyEndTime from tb1 where id=1";
           
DataTable dt = mallCtr.SqlTable(sql);
        if (dt.Rows.Count > 0)
        {
            panicBuyStartTime = dt.Rows[0]["panicBuyStartTime"].ToString(); //開始時間
            panicBuyEndTime = dt.Rows[0]["panicBuyEndTime"].ToString();  //結束時間


            if (Convert.ToDateTime(panicBuyStartTime) < Convert.ToDateTime(DateTime.Now.ToString()) && Convert.ToDateTime(panicBuyEndTime) > Convert.ToDateTime(DateTime.Now.ToString()))   //搶購已開始
            {
                lblStatus.Text = "秒殺結束倒計時：";
                panicTime = panicBuyEndTime;
            }
            else if (Convert.ToDateTime(panicBuyStartTime) > Convert.ToDateTime(DateTime.Now.ToString()))  //搶購未開始
            {
                lblStatus.Text = "秒殺開始倒計時：";
                panicTime = panicBuyStartTime;
            }
            else if (Convert.ToDateTime(panicBuyEndTime) < Convert.ToDateTime(DateTime.Now.ToString()))
            {
                lblStatus.Text = "秒殺活動已結束";
                LabelTime.Visible = false;
            }
        }
    }
}

好處：能擷取伺服器目前時間進行倒數計時

弊端：倒計時到達時，比如活動開始時，頁面不能自動重新整理

執行個體下載下傳：點選打開連結

js倒計時（擷取伺服器端時間）
js 倒計時 伺服器時間 c#
上一篇: 搞定面試題之“數組轉樹結構”
下一篇: php伺服器目前時間,php取伺服器目前時間（china）【轉】

繼續閱讀