第一个页面:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AJAX.aspx.cs" Inherits="AJAX" %>
<!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>AJAX</title>
<script type ="text/javascript" language ="javascript" >
var req; //定义变量,用来创建xmlhttprequest对象
function creatReq() // 创建xmlhttprequest,ajax开始
{
var url="AJAXSERVER.aspx"; //要请求的服务端地址
if(window.XMLHttpRequest) //非IE浏览器,用xmlhttprequest对象创建
{
req=new XMLHttpRequest();
}
else if(window.ActiveXObject) //IE浏览器用activexobject对象创建
{
req=new ActiveXObject("Microsoft.XMLHttp");
}
if(req) //成功创建xmlhttprequest
{
req.open("GET",url,true); //与服务端建立连接(请求方式post或get,地址,true表示异步)
req.onreadystatechange = callback; //指定回调函数
req.send(null); //发送请求
}
}
function callback() //回调函数,对服务端的响应处理,监视response状态
{
if(req.readystate==4) //请求状态为4表示成功
{
if(req.status==200) //http状态200表示OK
{
Dispaly(); //所有状态成功,执行此函数,显示数据
}
else //http返回状态失败
{
alert("服务端返回状态" + req.statusText);
}
}
else //请求状态还没有成功,页面等待
{
document .getElementById ("Text1").innerText ="数据加载中";
}
}
function Dispaly() //接受服务端返回的数据,对其进行显示
{
document .getElementById ("Text1").innerText =req.responseText;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="myTime"></div>
<input id="Button1" type="button" value="Get Time" onclick ="creatReq();"/>
<input id="Text1" type="text" /></div>
</form>
</body>
</html>
第二个页面的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 AJAXSERVER : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(1000); //为了看到ajax效果,将当前线程延时1000毫秒
Label1.Text = DateTime.Now.ToString();
Response.Write(Label1.Text); //输出当前时间
}
}
参照网上的资料,捣鼓了半天才做了 这么个小程序,汗...要多多练习!
评论