jq中的ajax不用考虑 兼容,跨域等问题,所以比较方便,下面我们简单谈一下jq中ajax的使用方法.
jQuery中 封装的 ajax请求 有3种
1, $.get() get请求方式
参数的形式是对象形式
$.get({
url : 地址(必填)
data : 携带的参数 对象形式
dataType : 期望的数据类型,如果为json,会将后端返回的json串,自动解析
success : function(){} 请求成功时执行的函数
})
2, $.post() post请求方式
参数的形式是对象形式
$.post({
url : 地址(必填)
data : 携带的参数 对象形式
dataType : 期望的数据类型,如果为json,会将后端返回的json串,自动解析
success : function(){} 请求成功时执行的函数
})
post和get两种方法基本没什么区别,不写dataTyoe的时候,如果后端返回的是一个json串,jq也会自动解析成json对象。
3, $.ajax() 综合方式 (用的较多的一种方式)
$.ajax({
常用:
url : 地址;
type / method : 请求方式 默认值是get方式
data : { } 传参参数,必须是对象形式
dataType : json, 设定为json,会自动解析反应提中的json串
success : function(){} 请求成功执行的函数
不常用:
async : 设定是否异步,默认值是true,false则异步执行ajax请求
error : function(){} 请求错误时执行的函数
请求成功时不会执行
timeout : 设定时间,单位 毫秒
如果请求时间超过设定的时间,认为是请求失败
必须是异步执行
cache : 设定是否缓存请求结果
默认值是 true,缓存请求结果
必须是get方式,这个设定才起作用
post方式不会缓存,设定也没有效果
context : 指定 执行函数中 this的指向
})
当使用jsonp方式跨域时 dataType : 'jsonp', 必须设置这个参数
$.ajax({
url : 'http://localhost/nz2002/week8_day04/01_jQuery_ajax/jsonp.php',
type : 'get',
data : {name:'张三',pwd:123456},
dataType : 'jsonp', // jsonp 跨域请求专门的参数
jsonp : 'fun', // 定义函数名称为 fun , 不写默认名称是 callback
success : function(res){
console.log(res);
}
})
因为jsonp的底层原来是利用script标签实现的,所以只能用get的方式,而ajax方法中type默认为get,因此type参数可省。函数名根据后端来决定写其他函数名还是使用默认。前端只需要在success中写需要执行的程序即可。
逆战班