码迷,mamicode.com
首页 > Web开发 > 详细

ajax请求方式

时间:2019-05-05 13:29:22      阅读:198      评论:0      收藏:0      [点我收藏+]

标签:error:   请求超时   val   fail   设置   移动   status   异步请求   back   

异步请求
有时我们不需要进行整个页面的刷新,只需要局部刷新,这样节省了,性能的消耗。实现局部刷新的前后台交互,可以使用AJAX的异步请求,Ajax可以使用js来获取XML的数据,也可以使用jq来获取json的数据。
1、使用jq发送get方法获取json的数据

$(function(){
$(“a”).click(function(){
$.get(
“emp/empServlert”,//路径
{“id”:1},//传入后台参数
function(data){//回调方法
alert(data);
},”json”//以json格式回调
)
})
})

2、使用jq发送get方法获取json的响应数据

$(function(){
$(“a”).click(function(){
$.getJson(
“emp/empServlert”,//路径
{“id”:1},//传入后台参数
function(data){//回调方法
alert(data);
})//使用了getJson就无需指定“json”格式
})
})

3、使用jq发送post方法获取json的响应数据

$(function(){
$(“a”).click(function(){
$.post(
“emp/empServlert”,//路径
{“id”:1},//传入后台参数
function(data){//回调方法
alert(data);
},”json”//以json格式回调
)
})
})

4、ajax

$(function(){
$(“a”).click(function(){
$.ajax({
type:”post”,//请求方法可以是post,get,和其他方法
url:”emp/empServlert”,//请求地址
data:{
id:1,
name:zzz
},//传入后台参数
dataType:”json”,//数据格式,jsonp为跨域访问
async: false,//true为异步,false为同步
success:function(data){//成功回调方法
data……
},
Error:function(){//失败回调方法

}
})
})
})

5、移动端ajax跨域访问

$(function(){
$(“a”).click(function(){
$.ajax({
type:”post”,//请求方法可以是post,get,和其他方法
url:”emp/empServlert”,//请求地址
data:{
id:1,
name:zzz
},//传入后台参数
dataType:”jsonp”,//数据格式,jsonp为跨域访问
jsonp:’’callback”,
async: false,//true为异步,false为同步
timeout:5000//设置请求超时时间
}).done(function(data){//成功回调

}).fail(function(jqXHR,textStatus,errorThrown){//失败回调

})
})
})

回调函数中的data:
1、返回数据为数组或者list等集合:

success:function(data){//成功回调方法
$.each(data,function(i){//循环
data[i];
})
},

2、返回数据为对象:

success:function(data){//成功回调方法
data.ename;//data.对象属性
},

3、返回数据为map:

success:function(data){//成功回调方法
$.each(data,function(key,value){//循环
Key ….;//键
Value….;//值
})
},

ajax请求方式

标签:error:   请求超时   val   fail   设置   移动   status   异步请求   back   

原文地址:https://www.cnblogs.com/zhangsonglin/p/10812390.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!