揭开AJAX神秘的面纱(AJAX个人学习笔记)第2/5页

 更新时间:2009年09月18日 13:50:55   作者:  
写这个学习笔记,只是记载一下自己的学习经过和体会,把一些学习重点记录下来,以备今后的巩固复习及应用,很多知识点没有详细介绍,所以并不完全适用于初学者,如果你是初学者,最好选择一本AJAX学习的书籍,然后与这篇学习笔记对照学习,效果会更好。

应用方式二:
在ASP.NET 中,内置了一种非常适合Ajax开发的后台处理方式即HttpHandler类,实际上所有的HttpHandler类都实现了IHttpHandler接口,用以进行请求接收和回送响应。
IHttpHandler这个接口提供了最基本的Web请求和Web响应的封装,可以将此接口看作是Web容器提供的基本的Web实现方式的封装类。
IHttpHandler接口具有一个方法:ProcessRequest(HttpContext context),及一个布尔值属性:IsReusable。所有实现IHttpHandler接口的类都必须实现上述方法和属性,其中ProcessRequest方法用于接收和处理请求以及发送响应,而IsReusable指示其他请求是否可以使用IHttpHandler实例也就是说后继的Http请求是不是可以继续使用实现了该接口的类的实例,一般情况下设定为true。

应用一案例代码:
Default.aspx 文件代码(只有前台代码,后台无任何代码):
复制代码 代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_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>Ajax请求页面</title>
<script type="text/javascript" language=javascript src="Ajax.js">
</script>
</head>
<body>
<form id="form1" runat="server">
<div align=center>
<div style="width:320px;height:150px" align=center>
<table border=0 cellpadding=0 cellspacing=0 width=300px>
<tr width=300px>
<td>请输入回传至服务器的文本</td>
</tr>
<tr>
<td><asp:TextBox runat="server" ID="txtCustomerInfo"></asp:TextBox></td>
</tr>
<tr>
<td><input type=button runat=server id="btnRequest" value="发送请求" onclick="startRequest(document.getElementById('txtCustomerInfo').value)" /></td>
</tr>
<tr>
<td>服务器处理后文本显示如下</td>
</tr>
<tr>
<td>
<div style="width:100%;background-color:Yellow;color:black;height:48px" id="divServerMsg">
</div>
</td>
</tr>
</table>
</div>
</div>
</form>
</body>
</html>

Ajax.js 文件代码(createXmlHttp()函数部分很通用,可以在自己的应用程序中不用修改而直接复制):
复制代码 代码如下:

var xmlHttp;

function createXmlHttp()
{
var activeKey=new Array("MSXML2.XMLHTTP.5.0",
"MSXML2.XMLHTTP.4.0",
"MSXML2.XMLHTTP.3.0",
"MSXML2.XMLHTTP",
"Microsoft.XMLHTTP");
if(window.ActiveXObject)
{
for(var i=0;i<activeKey.length;i++)
{
try
{
xmlHttp=new ActiveXObject(activeKey[i]);
if(xmlHttp!=null)
return xmlHttp;
}
catch(error)
{
continue;
}
}
throw new Error("客户端浏览器版本过低,不支持XMLHttpRequest对象,请更新浏览器");
}
else if(window.XMLHttpRequest)
{
xmlHttp=new window.XMLHttpRequest();
}
}

function addUrlParameter(url,parameterName,parameterValue)
{
url+=(url.indexOf("?"))==-1 ? "?" : "&";//判断当前URL中是否存在? 即参数分隔符
url+=encodeURIComponent(parameterName)+"="+encodeURIComponent(parameterValue);
return url;
}


function startRequest(customerStr)
{
xmlHttp=createXmlHttp();
xmlHttp.onreadystatechange=readyStateChangeHandler;
xmlHttp.open("GET",addUrlParameter("AjaxPage.aspx","customerInfo",customerStr),null);
xmlHttp.send(null);
}

function readyStateChangeHandler()
{
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
var str=xmlHttp.responseText;
var div=document.getElementById("divServerMsg");
div.innerHTML="<b>"+str+"</b>";
}
}
}

AjaxPage.aspx 文件代码(前台):
复制代码 代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxPage.aspx.cs" Inherits="AjaxPage" %>

<!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>
</head>
<body>
<form id="form1" runat="server">
<div>

</div>
</form>
</body>
</html>

AjaxPage.aspx.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 AjaxPage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string str = this.Request["customerInfo"].ToString();
string msg = "服务器获得你的消息,时间:" + DateTime.Now.ToShortTimeString() + "<br>你的消息为:" + str + "<br>你的地址:" + this.Request.UserHostAddress;
this.Response.Write(msg);
this.Response.End();
}
}

相关文章

  • 解决AJAX请求中含有数组的办法

    解决AJAX请求中含有数组的办法

    这篇文章主要给大家介绍了如何解决AJAX请求中含有数组的问题,文中给出了详细的示例代码,相信对大家的理解和学习很有帮助,有需要的朋友们下面跟着小编一起来看看吧。
    2016-12-12
  • AJAX验证数据库内容并将值显示在页面

    AJAX验证数据库内容并将值显示在页面

    光标离开文本框,在本页面的相应地方获取数据库中改值所对应的其他数据,相应的实现代码如下,感兴趣的朋友可以看看
    2014-08-08
  • ASP AJAX 静态分页

    ASP AJAX 静态分页

    这个页面注意是调用来自数据库中的数据。
    2009-01-01
  • ajax和jsonp跨域的原理本质详解

    ajax和jsonp跨域的原理本质详解

    跨域问题是我们在开发中经常会遇到的一个需求,下面这篇文章主要给大家介绍了关于ajax和jsonp跨域的原理本质,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2017-11-11
  • AJAXRequest v0.2

    AJAXRequest v0.2

    AJAXRequest v0.2...
    2006-12-12
  • ajax问题总结 比较全

    ajax问题总结 比较全

    在看文章前,先指定一个变量xhr,xhr代表ajax对象。测试浏览器:ie为ie6,firefox为2,其他的未测试。统称ie6为ie,firefox2为ff。
    2011-01-01
  • ajax实现输入提示效果

    ajax实现输入提示效果

    这篇文章主要为大家详细介绍了ajax实现输入提示效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-10-10
  • AJAX对服务器返回XML的处理方法

    AJAX对服务器返回XML的处理方法

    这篇文章主要介绍了AJAX对服务器返回XML的处理方法,实例分析了Ajax的实现技巧及针对XML返回数据的处理方法,需要的朋友可以参考下
    2015-03-03
  • Ajax获得站点文件内容实例不涉及服务器

    Ajax获得站点文件内容实例不涉及服务器

    选择一部著作,会通过 Ajax 实时获得相关的名字,一个简单的不涉及服务器的Ajax实例,需要的朋友可以参考下
    2014-05-05
  • Ajax Hacking

    Ajax Hacking

    [红色]Ajax Hacking...
    2006-11-11

最新评论