$.ajax()
举例:
<!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的默认选项