天天看點

【ASP.NET】利用UpdatePanel、ScriptManager、Timer完成定時局部更新

在《【ASP.NET】利用UpdatePanel與ScriptManager完成局部的更新》(點選打開連結)介紹過如果直接利用C#完成javascript中Ajax的局部更新。

其實在ASP.NET3.5版本之後,可以完全可以像窗體程式《【C#】Timer、窗體大小和螢幕大小》(點選打開連結)中的Timer一樣,實作javascript中setInterval的特效。

下面用一個例子來說明這個問題。

【ASP.NET】利用UpdatePanel、ScriptManager、Timer完成定時局部更新

在一個頁面有兩個文本,一個是一秒重新整理一次,一個不會被更新,其實這完全可以利用《【JavaScript】一個同步于本地時間的動态時間》(點選打開連結)完成的。

當然,如果定時更新中涉及一些背景代碼,用ASP.NET這樣寫,也不失為一種好方法。

具體代碼如下,上述頁面的前端代碼Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Timer._Default" %>

<!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>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:Label ID="Label1" runat="server" />
                <asp:Timer ID="Timer1" runat="server" Interval="500" OnTick="Timer1_Tick" />
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:Label ID="Label2" runat="server" /><br />
    </div>
    </form>
</body>
</html>
           

後端代碼Default.aspx.cs如下:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Timer
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Label1.Text = DateTime.Now.ToString();
            Label2.Text = DateTime.Now.ToString();
        }

        protected void Timer1_Tick(object sender, EventArgs e)
        {
            Label1.Text = DateTime.Now.ToString();
            Label2.Text = DateTime.Now.ToString();
        }
    }
}
           

這樣話,在Default.aspx标簽僅能管轄<asp:UpdatePanel>中<ContentTemplate>标簽内的内容,出了這個标簽的元件,即使後端代碼Default.aspx.cs涉及到這個元件沒有報錯,由于UpdatePanel的存在,ASP.NET也不會UpdatePanel以外的元件。如上方所示的在UpdatePanel以外的Label2就不會被Timer1所操作。Timer1的Tick事件就算有關于Label2的代碼,也僅能操作其中的Label1。

此外,還有一個小提示,Timer1必須被設定Interval,表示Timer1_Tick方法會在多少多少毫秒執行1次,這樣Timer才會生效,不會Timer沒有Interval是不會更新任何東西的。

繼續閱讀