当前位置: 首页 > 图文教程 > 网络编程 > AJAX技术 > 在ASP.NET中使用AJAX的简单方法

AJAX技术
什么是ajax的定义
ajaxrequest.js ajaxrequest 0.7最新版 使用AJAXRequest进行AJAX应用程序开发入门小技巧
javascript ajax类AJAXRequest2007-12-31 更新
ajax类AJAXRequest v0.8.01 2008-01-31 最新版附使用帮助
php ajax无刷新分页,支持id定位
js统计网页在线时间的脚本
用Ajax读取xml文件的简单例子
Ajax 的六个误区小结分析
Ajax核心XMLHTTP组件资料
ie7下利用ajax跨域盗取cookie的解决办法
ajax AjaxDownloader.js[modified]
Ajax获取页面被缓存的解决方法
php ajax无刷新上传图片实例代码
ajax实时任务提示功能的实现代码
php ajax网站浏览统计功能的简单实现
rails制作rss feed代码
一句话解决AJAX中文乱码问题[推荐]
有史以来最简单的AJAX回调库
使用ajax技术无刷新动态调用股票信息
ajax实例入门代码

AJAX技术 中的 在ASP.NET中使用AJAX的简单方法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-03   浏览: 35 ::
收藏到网摘: n/a

  本文介绍了使用AJAX和ASP.NET编写web应用程序的一个简单方法。同时,讨论了使用AJAX的好处和不足。为了举例说明,本文给出了相应的JavaScript代码和用C#.NET编写的ASP.NET代码。

  为什么使用AJAX

  也许大多数人已经知道AJAX的意思是异步JavaScript和XML(Asynchronous JavaScript and XML)。据我所知,这项技术最初是由Microsoft在1999年提出来的,也就是我们所熟知的"使用远程调用(remote calls)的DHTML / JavaScript web应用程序"。这项技术的核心就是通过浏览器发出一个异步的HTTP请求来调用服务端的网页或服务,在返回结果后,无需刷新就可以更新整个网页。这项技术经过不断地完善,到目前为此,使用AJAX的web程序从表现上看已经非常类似于Windows程序了。

  由于这项技术的实现需要依赖于前端的浏览器,因此,它的使用受到了限制。但在最近的几年,由于浏览器功能的加强和一些公司,如Google、Amazon.com的许多基于AJAX的应用的不俗表现,终于使这项技术凤凰涅磐、欲火重生。

  现在AJAX的使用已经非常广泛,任何带有丰富用户体验的动态网页都会不约而同地使用AJAX。

  解决方案

  本文所描述的使用AJAX的方法非常简单,而且效率很高。同时这种方法还非常容易维护,并且开发人员无需任何的特殊技巧就可以实现它,而且使用这种方法还可以跨浏览器。

  一个基本的AJAX实现需要两个主要部分:一个使用JavaScript代码编写的客户端HTML页,这些JavaScript用来向服务端发送请求和接收响应;一个可以接收请求和向客户端发送响应信息的远程页面。客户端的JavaScript代码的任务是建立一个XmlHttp对象,然后向服务端发送请求信息,最后通过回调方式处理服务端返回的响应信息。这一切都是由JavaScript代码实现的。

  本文的例子使用ASP.NET程序实现,在实现上要做到以下几点:

  1、AJAX可以在不同的ASP.NET页上向不同的服务端页发送请求。

  2、远程页面URL可以包含动态可计算的参数,这样做可以在ASP.NET的后端代码中更方便地建立URL字符串。

  3、远程页在更新HTML页之前可以使用复杂的数据进行响应,这也可以由ASP.NET的后端代码完成。

  4、一个服务端页面可以是一个扩展的第三方的页面,也可以是本身的web页或服务。

  以上的几点如图1所示

点击放大此图片
图1

  实现基本的AJAX JavaScript方法

  我将JavaScript方法分成两部分:调用特殊页的JavaScript方法和一般的JavaScript方法。特殊的方法包括一个回调方法,它的作用是更新页面内容。而其它的AJAX方法负责建立一个XmlHttp对象,并向服务端发出一个异步的HTTP请求。

  建立的XmlHttp对象因客户端浏览器的不同而有所差异。本文只考虑两种浏览器:一个是Microsoft的IE系列浏览器;另一个是Mozilla 系列浏览器,包括Mozilla Firefox、Netscape和Safari。我也在Opera浏览器上测试过,但我不能保证本文的代码可以很好地运行Opera浏览器上。下面是如何建立XmlHttp对象的代码:

function GetXmlHttpObject(handler)
{
 var objXmlHttp = null;
 if (!window.XMLHttpRequest)
 {
  // Microsoft
  objXmlHttp = GetMSXmlHttp();
  if (objXmlHttp != null)
  {
   objXmlHttp.onreadystatechange = handler;
  }
 }
 else
 {
  // Mozilla | Netscape | Safari
  objXmlHttp = new XMLHttpRequest();
  if (objXmlHttp != null)
  {
   objXmlHttp.onload = handler;
   objXmlHttp.onerror = handler;
  }
 }
 return objXmlHttp;
}

function GetMSXmlHttp()
{
 var xmlHttp = null;
 var clsids = ["Msxml2.XMLHTTP.6.0","Msxml2.XMLHTTP.5.0","Msxml2.XMLHTTP.4.0","Msxml2.XMLHTTP.3.0",
"Msxml2.XMLHTTP.2.6","Microsoft.XMLHTTP.1.0",
"Microsoft.XMLHTTP.1","Microsoft.XMLHTTP"];
 for(var i=0; i<clsids.length && xmlHttp == null; i++) {
  xmlHttp = CreateXmlHttp(clsids[i]);
 }
 return xmlHttp;
}

function CreateXmlHttp(clsid) {
 var xmlHttp = null;
 try {
  xmlHttp = new ActiveXObject(clsid);