這是最近做點(diǎn)一個(gè)用戶點(diǎn)贊的功能代碼岁诉，思路：
- 獲取當(dāng)前點(diǎn)擊的cuskey值（相當(dāng)于數(shù)據(jù)表的ID），用ajax 調(diào)用 invok/get 接口查詢并記錄對(duì)應(yīng)的內(nèi)容，var data222蚌堵；
- 調(diào)用接口/invok/update/ 上傳 dataa222 的參數(shù)并更新數(shù)據(jù)吮炕，成功后執(zhí)行頁面數(shù)值+1擂红，并改變按鈕圖片
- 更新成功后瘪松，需要再次調(diào)用/invok/get 接口，獲取當(dāng)前操作用戶所點(diǎn)贊的cuskey悠瞬，
- 獲取后们豌，更新當(dāng)前數(shù)據(jù)表中，zan這個(gè)數(shù)組的數(shù)據(jù)（存點(diǎn)贊了那些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);
//插入點(diǎn)贊數(shù)組
$.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優(yōu)化了下代碼：
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);
}
});
})
