您的位置：首页 > 其它

AJax案例之Hello World!

2012-05-24 14:43 211 查看
新建一个名为Default.aspx页面。首先我们在cs文件中的page_load事件函数中写下如下代码：
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

namespace AJaxTest

{

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

if (Request.QueryString["s"] == "1")//使用查询字串来指示这个请求是通过Ajax发出的

{

Response.Write("hello world!");//向HttpResponse中输出hello world!

Response.End();//将页面缓冲发送向客户端浏览器 并中止该页输出

//如果去掉这句 会得到多余的HTML代码

}

}

}

}

相对来说，我们在前台页面中书写的代码将会多一些，慢慢地你会发现这也许是Ajax的一个惯例：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="AJaxTest._Default" %>

<!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 language="javascript" type="text/javascript">

<!--

function GetInfo(){//我们就是通过这个函数来异步获取信息的

var xmlHttpReq = null;//声明一个空对象用来装入XMLHttpRequest

if (window.XMLHttpRequest){//除IE5 IE6 以外的浏览器XMLHttpRequest是window的子对象

xmlHttpReq = new XMLHttpRequest();//我们通常采用这种方式实例化一个XMLHttpRequest

}

else if (window.ActiveXObject){//IE5 IE6是以ActiveXObject的方式引入XMLHttpRequest的

xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");

//IE5 IE6是通过这种方式

}

if(xmlHttpReq != null){//如果对象实例化成功 我们就可以干活啦

xmlHttpReq.open("get","Default.aspx?s=1",true);

//调用open()方法并采用异步方式

xmlHttpReq.onreadystatechange=RequestCallBack; //设置回调函数

xmlHttpReq.send(null);//因为使用get方式提交，所以可以使用null参调用

}

function RequestCallBack(){//一旦readyState值改变，将会调用这个函数

if(xmlHttpReq.readyState == 4)

{

document.getElementById("iptText").value = xmlHttpReq.responseText;

//将xmlHttpReq.responseText的值赋给iptText控件

}

}

}

-->

</script>

</head>

<body>

<form id="form1" runat="server">

<div>

<input id="iptText" type="text" value="" />

<input type="button" id="" value="Ajax提交" onclick="GetInfo();" />

<!--点击这个按钮调用-->

</div>

<input id="Text2" type="text" value="" />

</form>

</body>

</html>

如果你在点击按钮的瞬间发现文本框内闪电般地出现了 “Hello world!”，那么恭喜你，你已经完成了一个Ajax调用。如果你还对前台页面中那些和C#貌似神离的代码觉得不太明白，没关系，接下来我们就将来简单 学习一下Ajax另外一个重要的部分——JavaScript。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航