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

ASP.NET
Asp.net利用JQuery弹出层加载数据代码
asp.net dataview做无限极分类的又一用法
asp.net ckeditor编辑器的使用方法
告别ADO.NET实现应用系统无缝切换的烦恼(总结篇)
asp.net 实现动态显示当前时间(不用javascript不考虑开销)
.net动态显示当前时间(客户端javascript)
asp.net 结合YUI 3.0小示例
asp.net 取消缓存相关问题说明
asp.net 计划任务管理程序实现，多线程任务加载
ASP.NET 跨页面传值方法
asp.net中url地址传送中文参数时的两种解决方案
Asp.net 菜单控件简洁版
asp.net jQuery Ajax用户登录功能的实现
asp.net SharpZipLib的压缩与解压问题
asp.net url重写后页面回传问题
asp.net与Discuz!NT整合集成实例教程
Discuz!NT 3与asp.net 整合的实例教程
测试控制台使用方法
.net 动态标题实现方法
asp.net *.ashx类型的文件使用说明

No. « 162 163 164 165 »

技术文章搜索

关键字

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

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

  }

}