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

ASP.NET
赫赫大名的A*寻路算法(vb.net版本)
asp.net(c#)下Jmai去说明 使用与下载
[原创]完美解决Could not load file or assembly ''AjaxPro.2'' or one of its dependencies. 拒绝访问。
asp.net下gridview 批量删除的实现方法
用CSS实现图片倾斜 只支持IE
.net get set用法小结
vs 不显示行号的操作方法
ASP.NET页面进行GZIP压缩优化的几款压缩模块的使用简介及应用测试!(附源码)
ASP.Net不执行问题一解
asp.net 无限分类
让VS2008对JQuery语法的智能感知更完美一点
扩展方法ToJSON() and ParseJSON()
asp.net下PageMethods使用技巧
Linq to SQL Delete时遇到问题的解决方法
实现ASP.NET多文件上传程序代码
ASP.NET AJAX 1.0 RC开发10分钟图解
asp.net get set用法
ASP.NET下使用WScript.Shell执行命令
asp.net2.0实现邮件发送(测试成功)
Asp.net 无限级分类实例代码

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


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

  }

}