基于JQuery的Ajax请求模板:$.post(),$.getJSON(),$.get(。。。本⽂将列举常⽤的基于JQuery的Ajax请求模板。列举的先后顺序按照我平常使⽤的频率。
1.post请求:$.post()
模板
<script>
$.post(
'[午参数的请求url]',
'[传参的json串形式]',
function(result){
//这⾥写回调函数,result为后台的返回值
}
);
</script>
⽰例
<script>
//根据账号密码登录
function loginByAccount(){
$.post(
'${tPath}/front/customer/loginByAccount',
$('#frmLoginByAccount').serialize(),
function(result){
//登录提⽰消息
layer.ssage,{time:1000});
if(result.status ==1){
//局部刷新
$('#navbarInfo').html(template('welcome',result.data));
$('#loginModal').modal('hide');
$('#loginMessage').html();
}
}
)
}
</script>
模板
<script>
jquery字符串截取$.get(
'[⽆参数的请求url]',
'[传参的json串形式]',
function(result){
//这⾥写回调函数,result为后台的返回值
}
);
</script>
⽰例
<script>
//短信登录-获取短信验证码
function sendVerificationCode(btn){
$.getJSON(
'${tPath}/front/sms/sendVerificationCode',
{'phone':'10086'},
function(result){
layer.ssage);
}
}
);
}
</script>
我们可以看到,$.post()和$.getJSON()的形式⼀模⼀样。唯⼀的区别在于前者发送的是post请求,对传⼊的字符串长度⽆要求,传⼊参数在地址栏不可见,传输较慢;后者发送的是get请求,对URL长度有限制(不同浏览器和不同接受服务器均有差异,以IE浏览器为例,不要超过2083字符),传⼊参数在地址栏可见,传输快。
⼀般情况下,$.post()和$.getJSON()就可以满⾜传输json串的ajax请求需要了。
<请求:$.get()
模板
<script>
$.get(
'[带参数或者⽆参数的请求url]',
function(result){
//这⾥写回调函数,result为后台的返回值
}
);
</script>
⽰例
<script>
//退出登录
function logout(){
$.get(
'${tPath}/front/customer/logout',
function(result){
if(result.status ==1){
//局部刷新
$('#navbarInfo').html(template('login'));
}
}
);
}
</script>
$.get() 是得到这个url指向的⽹址的内容, 内容可以是任意类型的数据, 通常是HTML
如果我们已经知道请求的⽹址返回的是⼀段JSON, 那么⽤$.getJSON(), jQuery会帮我们把取的的JSON字符串转换成js 对象
4.通⽤请求:$.ajax()
模板
<script>
$.ajax({
type:"POST",//data 传送数据类型。
dataType:'json',// 返回数据的数据类型json
url:"/site/abc",
cache:false,
data:{tel: tel},//传送的数据
error:function(){
//数据传输失败时使⽤
},
success:function(data){
//数据传输成功时的回调函数
}
})
</script>
我基本不会⽤到这种形式。但如果需要在数据传输失败时进⾏相关处理操作,还是需要使⽤这种形式。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论