jquery中的ajax函数吗,jQuery中Ajax几个常用的函数

jQuery中Ajax几个常用的函数

2019-02-13 10:27:11

jQuery的Ajax工具箱中包含的工具非常丰富，前面我们介绍的只是其中一小部分。鉴于有用的工具确实很多，下面我们就概述一些定制Ajax通信过程中较为重要的工具。

一、使用 .ajax()

前面已经介绍了一些用于Ajax通信的方法。但在jQuery内部，它们都是$.ajax()全局函数的一种变体。

比如我们要加载一个静态页面，使用$('#container').load('a.html')加载HTML片段。同样的操作如果使用$.ajax()来实现，代码如下。

示例：

$.ajax({

url: 'a.html',

success: function(data) {

$('#container').html(data);

}

});

这里， $.ajax()接受了一个包含30余项设置(settings)的对象作为参数(或者一个URL字符串作为第一个参数，一个对象作为第二个参数)，提供了极大的灵活性。

使用 $.ajax()函数的好处：

[1]避免浏览器缓存来自服务器的响应。非常适合服务器动态生成数据的情况。

[2]抑制正常情况下所有Ajax交互都可以触发的全局处理程序(例如通过$.ajaxStart()注册的处理程序)。

[3]在远程主机需要认证的情况下，可以提供用户名和密码。

二、使用$.ajaxSetup()

使用$.ajaxSetup()函数可以修改调用Ajax方法时每个选项的默认值。这个函数与$.ajax()接受相同的选项对象参数，之后的所有Ajax请求都将使用传递给该函数的选项，除非明确覆盖。

示例：

$.ajaxSetup({

url: 'a.html',

type: 'POST',

dataType: 'html'

});

$.ajax({

type: 'GET',

success: function (data) {

$('#container').html(data);

}

});

这与上面使用$.ajax()时实现的操作相同。

注意，虽然$.ajaxSetup()已经把type参数的默认值指定为POST，但在$.ajax()调用中仍然可以覆盖这个值，将其修改为GET。

三、部分加载HTML页面

使用Ajax技术取得并将HTML片段插入到当前页面中很简单。不过，有时候服务器提供的页面中的数据并非都 是我们想要的，有些部分对我们来说没用。当遇到这种情况时，也可以使用jQuery。

示例：

a.html完整代码如下：

This is the content of partA

This is the content of partB

This is the content of partC

This is the content of partD

主页面HTML：

Load HTML Segment

Load Data

Ajax取得a.html并将HTML片段插入到当前页面

$(document).ready(function () {

$('#letter a').click(function (event) {

event.preventDefault();

$('#container').load('a.html');

});

});

不过加载的内容中有些没有用，我们只想要此页面中的一部分(如partC部分)。

可以这么做：

$(document).ready(function() {

$('#letter a').click(function(event) {

event.preventDefault();

$('#container').load('a.html .partC');

});

});

这样就只加载了我们想要的部分。