第36章 介绍一些函数的用法,给出范例

2019-05-31  本文已影响0人  kzc爱吃梨

jQuery.ajax( [settings ] )

先看个例子

$.ajax({
    url: 'xxx.php',
    method: 'GET',
    data: {
        name: 'Byron',
        age: 24,
        sex: 'Male'
    }
}).done(function(result){

    console.log(result);

}).fail(function(jqXHR, textStatus){

    consloe.log(textStatus);

});

这样我们就发送了一个get请求

方法提供了几个常用的setting

  1. async:默认设置下,所有请求均为异步请求(也就是说这是默认设置为 true )。如果需要发送同步请求,请将此选项设置为 false

  2. beforeSend:请求发送前的回调函数,用来修改请求发送前jqXHR对象,此功能用来设置自定义 HTTP 头信息,等等。该jqXHR和设置对象作为参数传递

  3. cache:如果设置为 false ,浏览器将不缓存此页面。注意: 设置cache为 false将在 HEAD和GET请求中正常工作。它的工作原理是在GET请求参数中附加"_={timestamp}"

  4. context:这个对象用于设置Ajax相关回调函数的上下文。 默认情况下,这个上下文是一个ajax请求使用的参数设置对象

  5. data:发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后面,POST请求作为表单数据

  6. headers:一个额外的{键:值}对映射到请求一起发送。此设置会在beforeSend 函数调用之前被设置 ;因此,请求头中的设置值,会被beforeSend 函数内的设置覆盖

  7. method:HTTP 请求方法 (比如:"POST", "GET ", "PUT",1.9之前使用“type”)

  8. done:请求成功后执行,fail请求失败后执行,always不论请求成功失败都执行。

了解了这些参数,使用jQuery处理ajax请求就简单了

$.ajax({
  method: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" }
}).done(function( msg ) {
  alert( "Data Saved: " + msg );
});

[jQuery.get(url [,data] [,success] [,dataType])]

这是一个简写的Ajax函数,相当于:

$.ajax({
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

例子:

请求test.php页面,但忽略返回结果。

$.get( "test.php" );

请求test.php页面并发送一些额外的数据(同时仍然忽略返回结果)。

$.get( "test.php", { name: "John", time: "2pm" } );

将数据数组传递给服务器(同时仍然忽略返回结果)。

$.get( "test.php", { "choices[]": ["Jon", "Susan"] } );

jQuery.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )

使用一个HTTP GET请求从服务器加载JSON编码的数据,这是一个Ajax函数的缩写,这相当于:

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
上一篇下一篇

猜你喜欢

热点阅读