IFrame实现页面无刷新

一、html 和s代码段

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

    <title>使用 iframe 来实现不刷新页面改变局部内容</title>  

    <mce:script type="text/javascript"> 

    var IsInt=false;  

    var $=function(id)  

    {  

     return document.getElementById(id);  

    }  

    function Ajax()  

    {  

      $('img').style.display='block';  

      $('div1').innerHTML='Please Wait ....';  

      $('fra').src="Handler2.ashx?d="+new Date();  

    }  

    function callback()  

    {  

      if(IsInt)  

      {  

        $('div1').innerHTML=$('fra').contentWindow.document.body.innerHTML;  

        $('img').style.display='none';  

      }  

      else  

      {  

        IsInt=true;  

      }  

    }  

</head>  

<body>  

<div id="div1" ></div>  

<br />  

    <img  id="img" src= "img/loading51.gif"/>

<input id="Button1" type="button" value="Click Me" onclick="Ajax()" />  

<br />  

<iframe id="fra"  onload="callback()" style="display:none" mce_style="display:none"></iframe>  

  

</body>  

</html>  

 

二、C#后台程序

<%@ WebHandler Language="C#" Class="Handler2" %>  

  

using System;  

using System.Web;  

  

public class Handler2 : IHttpHandler {  

      

    public void ProcessRequest (HttpContext context) {  

        context.Response.ContentType = "text/plain";  

        System.Threading.Thread.Sleep(3000);  

        context.Response.Write(string.Format("当前时间{0}:", DateTime.Now));  

        context.Response.End();  

 

    }  

   

    public bool IsReusable {  

        get {  

            return false;  

        }  

    }  

  

}  

原文地址:https://www.cnblogs.com/fanyf/p/3651481.html