举例：
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $.ajax({url: "demo_test.txt", success: function(result){ $("#div1").html(result); }}); }); }); </script> </head> <body> <div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div> <button>Get External Content</button> </body> </html>
举例和使用
ajax()方法展现一个AJAX(异步的HTTP)请求。
语法
$.ajax({name:value, name:value, ... })
参数是一个或者多个name/value键值对，用于ajax请求。
可能的键值对如下：
| Name | Value/Description |
|---|---|
| async |
布尔值，是否异步亦或同步请求，默认异步true（异步） 如果需要同步，设置成fasle，但是注意会将浏览器锁住 注意跨域的JSONP请求不支持同步请求的选项 |
| beforeSend(xhr) | 在请求之前运行的函数 |
| cache |
布尔值，浏览器是否会缓存被请求的页面，默认true，对于script和jsonp类型会默认为fasle 如果设置成false，将会强迫被请求的页面不被浏览器缓存。注意：只有cache为fasle只会直接作用于HEAD和GET请求中。
它的工作原理是在GET请求参数后面添加"_={timestamp}"。
|
| complete(xhr,status) |
当请求完成之后执行的函数（在success和error函数之后） |
| contentType | 当发送数据给服务器时候使用的内容类型。默认是： "application/x-www-form-urlencoded" |
| context | 所有ajax相关的返回函数中的this所指定的内容。 |
| data | 将传递给服务器的数据内容 |
| dataFilter(data,type) |
处理XMLHttpRequest的原生返回内容的函数 |
| dataType |
希望服务器返回的数据类型 |
| error(xhr,status,error) |
当请求失败的时候运行的函数 |
| global |
布尔值，是否触发全局AJAX处理事件，默认是true |
| ifModified |
布尔值，只有从上一次请求开始返回值改变才能视为请求成功 默认false |
| jsonp |
在jsonp请求中重写回调函数的字符串 |
| jsonpCallback |
在jsonp请求中指定回调函数的函数名 |
| password |
在一个HTTP接入认证的请求中指定密码内容 |
| processData |
布尔值，是否发送的请求数据需要转换成一个查询字符串 默认是true |
| scriptCharset |
指定请求的字符类型 |
| success(result,status,xhr) |
当请求成功是运行的函数 |
| timeout |
请求超时的时间（以毫秒为单位） |
| traditional | 布尔值，使用传统的参数序列化方式？ |
| type | 请求的类型（GET还是POST） |
| url |
发送请求的URL,默认是当前页面 |
| username |
在一个HTTP接入认证的请求中指定用户名 |
| xhr |
用于创建XMLHttpRequest对象的方法 |
| accepts |
默认：由DataType决定 一个键对值，分别是一个已经给予的dataType和它的MIME类型，这将会在请求头部Accept字段显示。 这个头部信息高速服务器ajax将会接受什么类型的response。 |
| converters |
默认： 在jQuery1.5之前是 |
$.ajax({ accepts: {
//和下面的dataType相互对应 mycustomtype: 'application/x-some-custom-type' }, // 介绍怎样解析序列化的`mycustomtype`类型数据 converters: { 'text mycustomtype': function(result) { // Do Stuff return newresult; } }, // 希望从服务器端得到`mycustomtype` dataType: 'mycustomtype' });
将返回的数值'[{"x:"1", "y":"2"}, {"x:"3", "y":"4"}]'中的x和y的值都转化成数字形式：
$.ajaxSetup({ converters: { "json jsoncoords": function(data) { //返回的数据类型是json，并且和下面的dataType进行绑定 if (valid(data)) { $.each(data, function(i,o){ if (o.x) { data[i].x = parseFloat(o.x); } if (o.y) { data[i].y = parseFloat(o.y); } }); return data; } else { throw exceptionObject; } } } }); $.ajax({ url: "/foo/", dataType: "jsoncoords" //和上面的converters中的json jsoncoords中的jsoncoords对应 }).success(function(data){ // data should now have x and y as float numbers });
.ajaxSetup() 设置了全局的ajax的默认选项