jQuery ajax() 方法

jQuery Ajax方法

$ .ajax()方法执行异步HTTP(Ajax)请求。

$ .ajax()方法是jQuery发送的所有Ajax请求的基础。通常不需要直接调用此方法,因为可以使用$ .get()$ .post()load()等几个更高级的代替方法,并且更易于使用。但是,如果需要较少的常用选项,则$ .ajax()可以更灵活地使用。

语法:

语法一:1.5+版本

$.ajax(url, {name:value, name:value, ...})

语法二 :1.0+版本:

$.ajax({name:value, name:value, ...})

示例

使用添加的AJAX请求版本更改DIV元素的文本:1.5版本

$.ajax("ajax_intro.txt", {success: function(response){
  $("div").html(response);
});
测试看看‹/›

使用添加的AJAX请求版本更改DIV元素的文本:1.0版本:

$.ajax({
  url: "ajax_intro.txt",
  success: function(response){
    $("div").html(response);
  }
});
测试看看‹/›

请求ajax_get.php页面,并发送一些其他数据:

$.ajax({
  url: "ajax_get.php",
  data: {fname:"Seagull", lname:"Anna"},
  success: function(response){
    $("div").html(response);
  }
});
测试看看‹/›

请求ajax_get.php页面,发送一些其他数据,并发出警报状态消息:

$.ajax({
  url: "ajax_get.php",
  data: {fname:"Seagull", lname:"Anna"},
  success: function(response, status){
        $("div").html(response);
        alert(status);
  }
});
测试看看‹/›

使用HTTP POST方法请求ajax_post.php页面:

$.ajax({
  url: "ajax_post.php",
  method: "POST",
  success: function(response){
        $("div").html(response);
  }
});
测试看看‹/›

使用异步设置来指定同步请求:

$.ajax({
  url: "ajax_get.php",
  async: false,
  data: {fname:"Seagull", lname:"Anna"},
  success: function(response){
        $("div").html(response);
  }
});
测试看看‹/›

使用dataType设置为请求指定数据类型:

$.ajax({
  url: "/javascript/myscript.js",
  dataType: "script"
});
测试看看‹/›

如果Ajax请求遇到错误,则显示通知:

$.ajax({
  url: "wrong_file.html",
  success: function(response){
        $("div").html(response);
  },
  error: function(xhr){
        $("div").html("发生错误: " + xhr.status + " " + xhr.statusText);
  }
});
测试看看‹/›

请求文件,并在完成后通知用户。如果请求失败,则显示一条通知:

let request = $.ajax({
  url: "ajax_get.php",
  data: {fname:"Seagull", lname:"Anna"}
});

request.done(function(msg){
  $("div").html(msg);
});

request.fail(function(xhr, textStatus){
  $("div").html("Request failed: " + textStatus);
});
测试看看‹/›

参数值

参数为AJAX请求指定一个或多个name:value对。

可能的名称:下表中的值:

名称值类型描述
async布尔型一个布尔值,指示是否应异步处理请求。默认为true
beforeSend(xhr)函数发送请求之前运行的函数
cache布尔型一个布尔值,指示浏览器是否应缓存请求的页面。默认为true
complete(xhr,status)函数请求完成后要运行的函数(成功和错误功能之后)
contentType布尔值或字符串将数据发送到服务器时使用的内容类型。默认值为:“ application / x-www-form-urlencoded”
context普通对象为所有与AJAX相关的回调函数指定“ this”值
dataPlainObject或String或Array指定要发送到服务器的数据
dataFilter(data,type)函数用于处理XMLHttpRequest的原始响应数据的函数
dataType字符串服务器响应预期的数据类型
error(xhr,status,error)函数请求失败时运行的函数
global布尔型一个布尔值,指定是否触发请求的全局AJAX事件句柄。默认为true
ifModified布尔型一个布尔值,指定是否只有在自上一个请求以来响应已更改的情况下,请求才成功。默认值为:false。
jsonp字符串或布尔覆盖jsonp请求中的回调函数
jsonpCallback函数为jsonp请求中的回调函数指定名称
method字符串指定用于请求的HTTP方法。(获取或发布)。默认为GET
password字符串指定在HTTP访问认证请求中使用的密码
processData布尔型一个布尔值,指定是否应将与请求一起发送的数据转换为查询字符串。默认为true
scriptCharset字符串指定请求的字符集
statusCode普通对象响应具有相应代码时将调用数字HTTP代码和函数的对象
$ .ajax({
  statusCode:{
    404:function(){
      alert(“找不到页面”);
    }
  }
});
success(response,status,xhr)函数请求成功时要运行的函数
timeout数字请求的本地超时(以毫秒为单位)
traditional布尔型一个布尔值,指定是否使用传统的参数序列化样式
type字符串method的别名。如果您使用的是1.9.0之前的jQuery版本,则应使用type
url字符串指定将请求发送到的URL。默认为当前页面
username字符串指定要在HTTP访问认证请求中使用的用户名
xhr函数用于创建XMLHttpRequest对象的函数

jQuery Ajax方法