Question

现在我正在使用updatepanel和timer在aspx页面上显示一个时钟（小时：分钟+日期），它会导致服务器端每30秒发回一次。我不喜欢这个解决方案。我想有一个JavaScript时钟，从服务器的基值开始。任何人都可以提出比下面的代码更好的选择吗？

    <asp:UpdatePanel ID="UpdatePanelClock" runat="server">
        <ContentTemplate>
             <asp:Label ID="lblTime2" runat="server"></asp:Label>
         </ContentTemplate>
         <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Timer2" EventName="Tick" />
         </Triggers>
   </asp:UpdatePanel>

    <asp:Timer ID="Timer2" runat="server" Interval="30000" OnTick="Timer2_Tick"></asp:Timer>

背后的代码

protected void Page_Load(object sender, EventArgs e)
   {
    if (!Page.IsPostBack)
      {
         lblTime2.Text = DateTimeOffset.Now.ToString("hh:mm tt") + " - " + DateTimeOffset.Now.ToString("dddd, MMMM dd");
      }
   }

Answer 1

在我自己的库中，我创建了函数getCurrentTime。它是日期和时间的多功能吸气剂和转换器。此函数可以从时间戳创建日期，以微秒为单位。它允许您创建时钟，日历，倒数计时器等。

months = "Jan:31;Feb:28;Mar:31;Apr:30;May:31;Jun:30;Jul:31;Aug:31;Sep:30;Oct:31;Nov:30;Dec:31";
function getCurrentTime(unixTimeStamp)
{
    if (unixTimeStamp)
    {
        this.dateObject = new Date(unixTimeStamp);
    }
    else
    {
        this.dateObject = new Date();
    }
    // Time
    this.dateObject.h = this.dateObject.getHours();
    this.dateObject.m = this.dateObject.getMinutes();
    if (this.dateObject.m < 10)
    {this.dateObject.m = "0" + this.dateObject.m;}
    this.dateObject.s = this.dateObject.getSeconds();
    if (this.dateObject.s < 10)
    {this.dateObject.s = "0" + this.dateObject.s;}

    //Date
    this.dateObject.y = parseInt(this.dateObject.getFullYear());
    this.dateObject.mo = this.dateObject.getMonth()+1;
    if (this.dateObject.mo < 10)
    {this.dateObject.mo = "0" + this.dateObject.mo;}
    this.dateObject.d = this.dateObject.getDate();
    if (this.dateObject.d < 10)
    {this.dateObject.d = "0" + this.dateObject.d;}
    this.today = this.dateObject.d + "/" + this.dateObject.mo + "/" + this.dateObject.y;
    this.now = this.dateObject.d + "/" + this.dateObject.mo + "/" + this.dateObject.y + " " + this.dateObject.h + ":" + this.dateObject.m + ":" + this.dateObject.s;
    this.dateStamp = Date.parse(this.dateObject.mo+"/"+this.dateObject.d+"/"+this.dateObject.y);

    //these are the objects returned by getCurrentTime() next to hour, minutes, seconds, year, month and date.
    this.dateObject.fullDate = this.dateObject.d + " " + months.split(/;/)[this.dateObject.mo-1].split(/:/)[0] + " " + this.dateObject.y;
    this.dateObject.timeZoneOffset = dateObject.getTimezoneOffset(); //in minutes.
    this.dateObject.today = this.today;
    this.dateObject.now = this.now;
    this.dateObject.dateStamp = this.dateStamp;

    return this.dateObject;
}

    timeStamp = <%= ConvertToTimestamp(DateTime.UtcNow).ToString() %>
    setInterval(clock, 1000);

    function clock()
    {   
        timeStamp += 1000;
        var timeObj = getCurrentTime(timeStamp);
        var timeString = timeObj.h + ":" + timeObj.m + ":" + timeObj.s;
        console.log(timeString);
    }

没有unixTimeStamp的此函数获取客户端时间设置，但如果使用aspx <%= ConvertToTimestamp(DateTime.UtcNow).ToString() %>将日期变量加载到其中，它将从其获得的时间戳更新。如何检索时间戳：

public double ConvertToTimestamp(DateTime value)
{
    //create Timespan by subtracting the value provided from
    //the Unix Epoch
    TimeSpan span = (value - new DateTime(1970, 1, 1, 0, 0, 0, 0).ToLocalTime());

    //return the total milliseconds (which is a UNIX timestamp * 1000)
    return (long)span.TotalMilliseconds;
}

http://jsfiddle.net/3Lp4mwpn/：示例

请注意getCurrentTime返回的对象比显示时间更有可能。它可以为您提供多种日期格式。

在aspx页面上显示实时时钟（使用服务器时间）

1 个答案: