jquery ajax 函数用法详解
在前端开发中经常需要用到ajax请求后端接口，做异步请求，今天就来讲讲ajax函数的具体用法。
jQuery的$.ajax()函数是一种强大的工具，用于通过HTTP请求从服务器加载数据，而无需刷新整个页面。以下是对$.ajax()函数用法的详细解释：
- 基本用法
- 语法一：jQuery.ajax(settings)
- 参数settings是一个对象，包含了所有发送请求所需的额外参数设置[^1^]。
- 语法二：jQuery.ajax(url, settings)
- 这是语法一的变体，将参数对象settings中的可选属性url单独提取出来作为一个独立的参数[^1^]。
- 常用参数
- url（String类型）：请求的URL地址[^1^]。
- type（String类型）：请求类型，如“GET”或“POST”，默认为“GET”[^5^]。
- async（Boolean类型）：是否为异步请求，默认为true。如果设置为false，请求将是同步的[^5^]。
- beforeSend（Function类型）：在发送请求前可修改XMLHttpRequest对象的函数[^5^]。
- cache（Boolean类型）：指示是否缓存请求，默认为true。设置为false将强制浏览器不缓存当前请求[^5^]。
- data（任意类型）：发送到服务器的数据，可以是对象、字符串等[^5^]。
- dataType（String类型）：预期服务器返回的数据类型，如“json”、“xml”、“html”等[^5^]。
- success（Function类型）：请求成功时执行的回调函数[^5^]。
- error（Function类型）：请求失败时执行的回调函数[^5^]。
- complete（Function/Array类型）：请求完成后执行的回调函数，无论成功或失败都会调用[^1^]。
- 示例代码
总结来说，jQuery的$.ajax()函数提供了一种灵活且强大的方式来进行Ajax请求。通过合理配置其参数，可以实现各种复杂的数据交互需求。然而，需要注意的是，随着技术的发展和Web标准的变化，现代Web开发中更推荐使用Fetch API或其他更现代的技术来处理异步请求。
Java学科：ajax的常用参数介绍
1）url:
要求为String类型的参数，（默认为当前页地址）发送请求的地址。
2）type:
要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。
3）timeout:
要求为Number类型的参数，设置请求超时时间（毫秒）。此设置将覆盖$.ajaxSetup()方法的全局设置。
4）async:
要求为Boolean类型的参数，默认设置为true，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为false。
注意，同步请求将锁住浏览器，用户其他操作必须等待请求完成才可以执行。
5）cache:
要求为Boolean类型的参数，默认为true（当dataType为script时，默认为false），设置为false将不会从浏览器缓存中加载请求信息。
6）data:
要求为Object或String类型的参数，发送到服务器的数据。如果已经不是字符串，将自动转换为字符串格式。get请求中将附加在url后。防止这种自动转换，可以查看 processData（防止自动转换）选项。对象必须为key/value格式，例如{foo1:\”bar1\”,foo2:\”bar2\”}转换为&foo1=bar1&foo2=bar2。如果是数组，JQuery将自动为不同值对应同一个名称。例如{foo:[\”bar1\”,\”bar2\”]}转换为&foo=bar1&foo=bar2。
7）dataType:
要求为String类型的参数，预期服务器返回的数据类型。如果不指定，JQuery将自动根据http包mime信息返回responseXML或responseText，并作为回调函数参数传递。可用的类型如下：
● xml：返回XML文档，可用JQuery处理。
● html：返回纯文本HTML信息；包含的script标签会在插入DOM时执行。
● script：返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时（不在同一个域下），所有post请求都将转为get请求。
● json：返回JSON数据。
● jsonp：JSONP格式。使用SONP形式调用函数时，例如myurl?callback=?，JQuery将自动替换后一个“?”为正确的函数名，以执行回调函数。
● text：返回纯文本字符串。
8）beforeSend：
这个参数主要是为了在向服务器发送请求前，执行一些操作。要求为Function类型的参数，发送请求前可以修改XMLHttpRequest对象的函数，例如添加自定义HTTP头。在beforeSend中如果返回false可以取消本次ajax请求。XMLHttpRequest对象是惟一的参数。
9）complete：
要求为Function类型的参数，请求完成后调用的回调函数（请求成功或失败时均调用）。参数：XMLHttpRequest对象和一个描述成功请求类型的字符串。
10）success：
要求为Function类型的参数，请求成功后调用的回调函数，有两个参数。
（1）由服务器返回，并根据dataType参数进行处理后的数据。
（2）描述状态的字符串。
11）error:
要求为Function类型的参数，请求失败时被调用的函数。该函数有3个参数，即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。ajax事件函数如下：
12）contentType：
要求为String类型的参数，当发送信息至服务器时，内容编码类型默认为\”application/x-www-form-urlencoded\”。该默认值适合大多数应用场合。
13）dataFilter：
要求为Function类型的参数，给Ajax返回的原始数据进行预处理的函数。提供data和type两个参数。data是Ajax返回的原始数据，type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
14）dataFilter：
要求为Function类型的参数，给Ajax返回的原始数据进行预处理的函数。提供data和type两个参数。data是Ajax返回的原始数据，type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
15）global：
要求为Boolean类型的参数，默认为true。表示是否触发全局ajax事件。设置为false将不会触发全局ajax事件，ajaxStart或ajaxStop可用于控制各种ajax事件。
16）ifModified：
要求为Boolean类型的参数，默认为false。仅在服务器数据改变时获取新数据。服务器数据改变判断的依据是Last-Modified头信息。默认值是false，即忽略头信息。
17）jsonp：
要求为String类型的参数，在一个jsonp请求中重写回调函数的名字。该值用来替代在\”callback=?\”这种GET或POST请求中URL参数里的\”callback\”部分，例如{jsonp:\’onJsonPLoad\’}会导致将\”onJsonPLoad=?\”传给服务器。
18）username：
要求为String类型的参数，用于响应HTTP访问认证请求的用户名。
19）password：
要求为String类型的参数，用于响应HTTP访问认证请求的密码。
20）processData：
要求为Boolean类型的参数，默认为true。默认情况下，发送的数据将被转换为对象（从技术角度来讲并非字符串）以配合默认内容类型\”application/x-www-form-urlencoded\”。如果要发送DOM树信息或者其他不希望转换的信息，请设置为false。
21）scriptCharset：
要求为String类型的参数，只有当请求时dataType为\”jsonp\”或者\”script\”，并且type是GET时才会用于强制修改字符集(charset)。通常在本地和远程的内容编码不同时使用。
Ajax异步操作集合啦
/*
* Ajax的核心操作对象是xmlHttpRequest
*/
实例化对象
考虑到兼容问题,非IE5/IE6 使用 => new XMLHttpRequest;
IE5/IE6使用 => new ActiveXObject(Microsoft.XMLHTTP); ☯神呐，请带走IE吧！
发送请求
使用 XMLHttpRequest 对象的 open(\’GET\’,url,async) 和 send 方法：
❶ open 有三个参数：
分别为http请求方式(get/post) ==》与 POST 相比，GET 更简单也更快，POST 没有数据量限制，不会缓存，相对安全
http请求地址 ==》url(统一资源定位符)文件所在服务器的地址
：true（异步）或 false（同步）
❷send(string) ：仅用于 POST 请求
接受响应，执行回调
当readyState的值发生改变时，触发readystatechange事件，事件中就可以为所欲为了
readyState==4 =>请求加载完成 / http的状态为200 =>响应成功
/*
* js就是这么复杂，一套行云流水的操作下来，浏览器F5，哎，咋没效果，不行，修改代码，再刷，还有bug等着你！ (∪｡∪)｡｡｡zzz 敲两行jQuery放松一下！
* jQuery操作ajax用一个封装的函数 $.ajax 就可以搞定,操作步骤及其简化！！！
*/
常用参数
type:\”get\”, //http请求方式,值为 get/post 默认值为get
url:\”\”, //统一资源定位符 ！！！重要参数
async:true, //值为 true/false 默认值为true,为异步,ajax发送请求后,在等待server端返回的这个过程中，会继续执行ajax块后面的脚本（异步思想）,直到server端返回正确的结果才会去执行success
dataType:\”xml\”, //返回数据的类型 ,值为 xml/html/script/json/jsonp/text
data:obj, //传给sever的数据 可以是字符串也可以是对象(比如登陆时传用户名密码)
cache:true, //默认为true（当dataType为script时，默认为false），设置为false将不会从浏览器缓存中加载请求信息
complete:function{}, //请求完成后调用的回调函数（请求成功或失败时均调用）
success:function(res){}, //成功时调用回调函数 ！！！重要回调
error: function (err) {} //发生错误时调用回调函数
jquery封装了 $.ajax $.post $.get $(selector).load $.getJson $.getScript
其实弄懂$.ajax就好了，别的都是它延伸出来，具有某种特异功能，$.ajax是大一统，霸天下，废话不多说，直接上实例，看注释
当然我们可以用浏览器提供的调试工具，搞清楚 阿贾克斯 的一举一动，还是
本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com
文章为作者独立观点不代本网立场，未经允许不得转载。
投诉举报&联系我们：
