';
str+='
';
str+='
';
str+='';
});
$(".books").append(str); //使用append参数把内容加上去
}
},
error : function(err) {
console.log("渲染出错了",err)
}
});
})
复制代码
六. 怎么异步刷新呈现在页面上面的内容?
例如:如果你有一个获取收货地址的接口,你呈现在页面上面,然后你重新添加一条,收货地址列表没有改变,重新刷新页面才能改变,如果你要点击保存就刷新掉收货地址列表而不用刷新整个页面怎么实现呢?
代码如下:
复制代码
$(function() {
InitData(); //加载收货地址
})
//收货地址呈现数据列表接口
function InitData() {
$.ajax({
url: "https://www.xxxxx.com/user/xxxxxx/", //收货地址
type: "get",
async: true,
success: function(data) {
}
})
}
$("#jiaru").click(function() {
$.ajax({
url: "https://www.xxxxxx.cn/user/xxxxx/", //重新加入一条收货地址接口
type: "get",
success: function(data) {
InitData(); //加入成功后,再次调用一次查询收货地址接口,就能实现异步刷新
},
error: function() {
alert("加入失败");
}
});
});
复制代码
七. 登录成功后获取到用户userId怎么在后面的接口引用到呢?
1.首先登录成功后返回给你一个用户id,参数比如说是userId,你可以cookie保存一下然后到后面获取到;
2.怎么cook保存呢?
a.建立一个全局js文件,全局定义一下cookie:
复制代码
//Cookie全局
function setCookie(name,value)
{
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getCookie(name)
{
var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
if(arr=document.cookie.match(reg))
return unescape(arr[2]);
else
return null;
}
复制代码
b.在登录接口页setCookie保存到userId:
复制代码
//登录
$("#denglu").click(function() {
$.ajax({
url: "https://www.xxxxxx.cn/xxxxx/login/",
data: "",
type: "get",
success: function(data) {
var userId = JSON.parse(data).UserID; //从接口返回值里面取到userId
setCookie("UserId", userId) //set保存一下方便后面取到
if(JSON.parse(data).state === 201 || JSON.parse(data).state === 202) {
alert("登录失败,请前往注册")
} else {
alert("登录成功")
window.location.href = 'index.html';
}
},
error: function() {
alert("登录失败");
}
});
});
复制代码
c.在其他页面getCookie获取到userId:
复制代码
var userId = getCookie("UserId"); //在上面提到的接口传值,getcookie获取到userId
复制代码
3.sessionStorage保存方法:
复制代码
sessionStorage.obj = JSON.parse(data).OrderID;
复制代码
八. 没有接口的情况下,怎么把一个页面的值传到其他页面?
1.url传值方法:
复制代码
$(".to-product").eq(0).click(function(){
$(".to-product").eq(0).attr("href","bookdetail/productdetail1.html?goodsID="+obj[0].goodsID+"");
})
复制代码
2.其他页面取值:
复制代码
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
var r = window.location.search.substr(1).match(reg); //匹配目标参数
if(r != null) return unescape(r[2]);
return null; //返回参数值
}
var goodsID = getUrlParam('goodsID'); //接收URL中的参数booksId
复制代码
3.重点注意:这种方法不利于上传价格之类容易篡改信息的数据,建议其他数据通过接口的方法获取;
九. 怎么清空cookie保存的数据(比如退出登录效果)
复制代码
//获取到用户ID
var userId = getCookie("UserId");
//判断一下userId是否为空
if(userId !=null){
$(function(){
//点击按钮退出登录
$(".header-con").children(".p2").children("a:eq(1)").click(function(){
clearAllCookie(); //清空cookie的方法
})
})
}else{
}
//清除所有cookie函数
function clearAllCookie() {
var keys = document.cookie.match(/[^ =;]+(?=\=)/g);
if(keys) {
for(var i = keys.length; i--;)
document.cookie = keys[i] + '=0;expires=' + new Date(0).toUTCString()
}
}
复制代码
十. 怎么获取接口中单个列表信息的数据?
1.遍历列表获取到该商品的信息,取到想要得到的id或者价格:
复制代码
//遍历
$('#txt-list tr').each(function() {
var _value = $(this).find('td').next(".isCurrent").text();
if(parseInt(_value) == 1) {
} else {
}
});
复制代码
2.parent和next方法等:
复制代码
var addressID = $(this).parent("a").parent("td").next("td").next("td").html();
复制代码
十一. 怎么拼接字符串并放到一个数组里面?
1.先创建一个新的对象,遍历json数组,然后拼接完成之后,去掉拼接进去的数组[ ]符号以及字符串的\符号:
复制代码
var goodsDetail = new Array();
$('#s-infos li').each(function(index){
if($(this).find('div').children('.mh-dxone').prop('checked')){
var goodsID = $(this).find('div').next(".goodsID").text(),
quanlity = $(this).find('div').next(".shopcart-info-num").children(".cartnum").val();
goodsDetail.push('[{"goodsID":' + goodsID + ',"quanlity":' + quanlity + '}]');
}
})
var straaa = JSON.stringify(goodsDetail);
var strbbb = straaa.replace('"[', "");
var strccc = strbbb.replace(']"',"").replace(/[\\]/g,'');
复制代码
十二. 总结
ajax介绍就暂时到这里告一段落了,如果博文有什么错误或者不懂的地方,欢迎在博文下面留言,博主有时间将一一解答,同时ajax从零基础到实战也不是看看就能理解的,希望大家能够边自己实践边理解,这样更有利于大家成长,谢谢!https://www.cnblogs.com/hejun26/p/9613146.html
'+v.goodsName+'
'; str+=''+v.goodsresume+'
'; str+='¥'+v.price+'.00'+'
'; str+='