各种AJAX方法的使用比较详解

阅读目录

开始

第一代技术：生成客户端代理脚本调用服务端

新技术的改进方向

第二代技术：jQuery直接调用WebService

第三代技术：更简单的数据格式

第四代技术：直接提交表单

多submit按钮的提交（用jQuery.form实现）

批量输入控件的提交（用jQuery.form实现）

提交复杂表单（用jQuery.form实现）

各种AJAX开发方法的对比与总结

相关链接

本文收集了在ASP.NET平台上，一些具体代表性的AJAX开发方法，我将用实际的示例代码来演示如何使用它们，让您感受AJAX的进化历程，同时也希望将一些优秀的AJAX开发方法介绍给您。

为了方便地介绍这些AJAX开发方法，我将它们划分为四代技术。

注意：按代划分AJAX技术纯属我个人的观点，只为了更好了区分它们。

此外，一些不借助任何框架类库的原始AJAX开发方法，本文将不讨论它们。

第一代技术：生成客户端代理脚本调用服务端

这类技术展示了第一代的AJAX框架的主要设计思想：在服务端为客户端生成代理脚本， 然后由这些代理脚本调用服务端，调用者可以不必知道整个调用过程是如何实现的， 而且在客户端的调用风格也基本与服务端的代码类似。

这类技术的代表作有：ASP.NET AJAX, AjaxPro 二个服务端框架。

下面我将用ASP.NET AJAX框架来演示如何进行AJAX开发。

首先，我们可以创建一个WebService服务：

[WebService(Namespace = "http://tempuri.org/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]//若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。 [System.Web.Script.Services.ScriptService]public class WebService1 : System.Web.Services.WebService {  [WebMethod]  public int Add(int a, int b)  {    return a + b;  }

这段代码就是一个普通的WebService代码，唯独需要注意的是：在类的定义上加了一个ScriptService修饰特性。

接下来，我们还需要在一个ASPX页面中，用ScriptManager为它生成客户端的代理脚本：

<asp:ScriptManager ID="ScriptManager1" runat="server">  <Services>    <asp:ServiceReference Path="/WebService1.asmx" InlineScript="true" />  </Services></asp:ScriptManager>

说明：InlineScript="true"的设置并不是必须的，只是为了让我们看到ScriptManager到底生成了什么代码。

从截图可以看到，除了引入了二个必要的AJAX客户端类库外，还在客户端为WebService1生成了代理脚本。

有了这些代码后，我们可以用下面的JavaScript代码调用服务端：