这是最近做点一个用户点赞的功能代码，思路：
- 获取当前点击的cuskey值（相当于数据表的ID），用ajax 调用 invok/get 接口查询并记录对应的内容，var data222；
- 调用接口/invok/update/ 上传 dataa222 的参数并更新数据，成功后执行页面数值+1，并改变按钮图片
- 更新成功后，需要再次调用/invok/get 接口，获取当前操作用户所点赞的cuskey，
- 获取后，更新当前数据表中，zan这个数组的数据（存点赞了那些cuskey）；
源代码：
$.ajax({
url: '/invok/get/',
type: 'POST',
data: { actid: '2017082121470227', keytype: '3', cuskey: cuskeysss },
dataType: 'json',
success: function(data) {
// console.log(data);
count1 = JSON.parse(data.Data.JsonContent).count;
var data222 = {
cuscode: JSON.parse(data.Data.JsonContent).cuscode,
content: JSON.parse(data.Data.JsonContent).content,
count: count1 + 1,
satus: JSON.parse(data.Data.JsonContent).satus,
Sort: JSON.parse(data.Data.JsonContent).Sort,
cuskeya: JSON.parse(data.Data.JsonContent).cuskeya,
name: JSON.parse(data.Data.JsonContent).name,
img: JSON.parse(data.Data.JsonContent).img,
};
$.ajax({
url: '/invok/update/',
type: 'POST',
data: { actid: '2017082121470227', keytype: '3', cuskey: cuskeysss, jsoncontent: JSON.stringify(data222) },
dataType: 'json',
success: function(data) {
// show();
$(obj).find("img").attr("src", "http://i2.mbscss.com/img/moonbasa/2017/ydw/M8_21_203200.jpg");
$(obj).removeAttr('onclick');
$(obj).find(".btn2").html(count1 + 1);
//插入点赞数组
$.ajax({
url: '/invok/get/',
type: 'POST',
data: { actid: '2017008821142411112', keytype: '3', cuskey: $.cookie('MoonbasaT_Cuscode') },
dataType: 'json',
success: function(data) {
var arr = JSON.parse(data.Data.JsonContent).zan;
arr.push(cuskeysss);
var data333 = {
zan: arr,
};
$.ajax({
url: '/invok/update/',
type: 'POST',
data: { actid: '2017008821142411112', keytype: '3', cuskey: $.cookie('MoonbasaT_Cuscode'), jsoncontent: JSON.stringify(data333) },
dataType: 'json',
success: function(data) {
// console.log(data);
}
});
}
});
}
});
}
});
可以看到，嵌套了很多层，代码的可读性十分的差，所以我用promise优化了下代码：
var ajaxPromise = new Promise(function(resolve) {
resolve();
});
ajaxPromise.then(function() {
return $.ajax({
url: '/invok/get/',
type: 'POST',
data: { actid: '2017082121470227', keytype: '3', cuskey: cuskeysss },
dataType: 'json',
success: function(data) {
console.log(data);
return data;
}
});
}).then(function(data) {
console.log(data);
var count1 = JSON.parse(data.Data.JsonContent).count;
var data222 = {
cuscode: JSON.parse(data.Data.JsonContent).cuscode,
content: JSON.parse(data.Data.JsonContent).content,
count: JSON.parse(data.Data.JsonContent).count + 1,
satus: JSON.parse(data.Data.JsonContent).satus,
Sort: JSON.parse(data.Data.JsonContent).Sort,
cuskeya: JSON.parse(data.Data.JsonContent).cuskeya,
name: JSON.parse(data.Data.JsonContent).name,
img: JSON.parse(data.Data.JsonContent).img,
};
$.ajax({
url: '/invok/update/',
type: 'POST',
data: { actid: '2017082121470227', keytype: '3', cuskey: cuskeysss, jsoncontent: JSON.stringify(data222) },
dataType: 'json',
success: function(data) {
// show();
$(obj).find("img").attr("src", "http://i2.mbscss.com/img/moonbasa/2017/ydw/M8_21_203200.jpg");
$(obj).removeAttr('onclick');
$(obj).find(".btn2").html(count1 + 1);
}
});
}).then(function() {
return $.ajax({
url: '/invok/get/',
type: 'POST',
data: { actid: '2017008821142411112', keytype: '3', cuskey: $.cookie('MoonbasaT_Cuscode') },
dataType: 'json',
success: function(datas) {
return datas;
}
});
}).then(function(datas) {
var arr = JSON.parse(datas.Data.JsonContent).zan;
arr.push(cuskeysss);
var data333 = {
zan: arr,
};
$.ajax({
url: '/invok/update/',
type: 'POST',
data: { actid: '2017008821142411112', keytype: '3', cuskey: $.cookie('MoonbasaT_Cuscode'), jsoncontent: JSON.stringify(data333) },
dataType: 'json',
success: function(data) {
// console.log(data);
}
});
})
