当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > 一个无刷新效果定时自动更新页面的例子

ASP.NET
二级域名Cookie问题的解决方法
如何为asp.net网站项目添加子项目
asp.net用url重写URLReWriter实现任意二级域名
asp.net 序列化and反序列化演示
asp.net Timer的使用方法
AjaxControlToolKit DropDownExtender(下拉扩展控件)使用方法
AjaxControlToolKit CalendarExtender(日历扩展控件)的使用方法
让GridView只显示特定用户的数据的方法
让GridView只更新某些特定的数据的方法
ajaxControlToolkit中CascadingDropDown的用法说明
axp.net ScriptManager的简单用法
把程序集安装到全局程序集缓存中的步骤
引用全局程序集缓存内的程序集的方法
asp.net COOKIES需要注意的一点
asp.net UrlReWriter使用经验小结
页面导出为Excel的时间格式的问题
asp.net cookie清除的代码
Asp.net XMLHTTP封装类(GET,Post发送和接收数据)
ASP.NET XmlHttp跨域访问实现代码
Asp.NET 随机码生成基类(随机字母,随机数字,随机字母+数字)

ASP.NET 中的 一个无刷新效果定时自动更新页面的例子


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-14   浏览: 247 ::
收藏到网摘: n/a

首先在ASP.Net创建两个WebForm页,分别命名为Default1,Default2。下面给出代码清单:

//Default1.aspx

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

<!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">

    var XmlHttp;

    function createXmlHttpRequest()
    {
     
      if (window.XmlHttpRequest)
      {
        XmlHttp = new XmlHttpRequest();
      }
      else if (window.ActiveXObject)
      {
        try
        {
        XmlHttp = new ActiveXObject("MsXml2.XmlHTTP");
        }
        catch (e1)
        {
        try
        {
          XmlHttp = new ActiveXObject("Microsoft.XmlHTTP");
        }
        catch (e2)
        {}
        }
      }
      return XmlHttp;    
    }

 

    function doStart() {
   
        createXmlHttpRequest();

        var url = "Default2.aspx?task=reset";

        XmlHttp.open("POST", url, true);

        XmlHttp.onreadystatechange = startCallback;

        XmlHttp.send(null);

    }

 

    function startCallback() {

        if (XmlHttp.readyState == 4) {

          if (XmlHttp.status == 200) {

            setTimeout("pollServer()", 1000);

            refreshTime();

          }
          else {
       
            alert("HTTP error: "+XmlHttp.status);
          }

        }
       
    }

 

    function pollServer() {

        createXmlHttpRequest();

        var url = "Default2.aspx?task=foo";

        XmlHttp.open("POST", url, true);

        XmlHttp.onreadystatechange = pollCallback;

        XmlHttp.send(null);

    }

 

  function refreshTime(){

    var time_span = document.getElementById("time");

    var time_val = time_span.innerHTML;

    var int_val = parseInt(time_val);

    var new_int_val = int_val - 1;

 

    if (new_int_val > -1) {
   
        setTimeout("refreshTime()", 1000);

        time_span.innerHTML = new_int_val;

    } else {

        time_span.innerHTML = 1;

    }

  }

 

  function pollCallback() {

    if (XmlHttp.readyState == 4) {

        if (XmlHttp.status == 200) {

          var message = XmlHttp.responseXml.getElementsByTagName("message")[0].firstChild.data;

          if (message != "done") {

            var new_row = createRow(message);

            var table = document.getElementById("dynamicUpdateArea");

            var table_body = table.getElementsByTagName("tbody").item(0);

            var first_row = table_body.getElementsByTagName("tr").item(1);

            table_body.insertBefore(new_row, first_row);

            setTimeout("pollServer()", 1000);

            refreshTime();

          }

        }
        else {
     
          alert("HTTP error: "+XmlHttp.status);
        }

    }

  }

  function createRow(message) {

    var row = document.createElement("tr");

    var cell = document.createElement("td");

    var cell_data = document.createTextNode(message);

    cell.appendChild(cell_data);

    row.appendChild(cell);

    return row;
   
  }

</script>
</head>
<body>
  <form id="form1" runat="server" >

    <h1>Ajax Dynamic Update Example</h1>

    This page will automatically update itself:

      <input type="button" value="Launch" id="go" onclick="doStart();"/>

    <p/>

    Page will refresh in <span id="time">1</span> seconds.

    <p/>

    <table id="dynamicUpdateArea" align="left">

    <tbody>

      <tr id="row0"><td></td></tr>

    </tbody>

  </table>
  </form>
</body>
</html>

//Default2.cs

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;

public partial class Default2: System.Web.UI.Page
{
  private static int counter = 1;

  protected void Page_Load(object sender, EventArgs e)
  {

    String res = "";

    String task = this.Request.Params["task"];

    String message = "";

    if (!string.IsNullOrEmpty(task))
    {
        if (task.Equals("reset"))
        {
          counter = 1;
        }
        else
        {

          switch (counter)
          {

            case 1: message = "Steve walks on stage"; break;

            case 2: message = "iPods rock"; break;

            case 3: message = "Steve says Macs rule"; break;

            case 4: message = "Change is coming"; break;

            case 5: message = "Yes, OS X runs on Intel - has for years"; break;

            case 6: message = "Macs will soon have Intel chips"; break;

            case 7: message = "done"; break;

          }

          counter++;

        }
        res = "<message>" + message + "</message>";


        Response.ContentType = "text/Xml";

        Response.AppendHeader("Cache-Control", "no-cache");

        Response.Write("<response>");

        Response.Write(res);

        Response.Write("</response>");

        Response.End();
    }

  }

}