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

ASP.NET
Asp.Net 通用数据操作类 (附通用数据基类)
asp.net汉字转拼音和获取汉字首字母的代码
asp.net 多字段模糊查询代码
OpenCms 带分页的新闻列表
URLRewriter最简单入门介绍 URLRewriter相关资源
asp.net Repeater取得CheckBox选中的某行某个值
asp.net清空Cookie的两种方法
asp.net一些很酷很实用的.Net技巧
asp.net生成高质量缩略图通用函数(c#代码),支持多种生成方式
asp.net TripleDES加密、解密算法
Asp.net中防止用户多次登录的方法
asp.net Repeater取得CheckBox选中的某行某个值的c#写法
asp.net DataGridView导出到Excel的三个方法[亲测]
C#,winform,ShowDialog,子窗体向父窗体传值
asp.net学习中发现的比较完整的流程
ASP.net 页面被关闭后,服务器端是否仍然执行中?
asp.net Context.Handler 页面间传值方法
asp.net xml序列化与反序列化
asp.net实例代码protected override void Render(HtmlTextWriter writer)
asp.net(c#)捕捉搜索引擎蜘蛛和机器人

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-14   浏览: 240 ::
收藏到网摘: 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();
    }

  }

}