jQuery完成后不等待它完成
jQuery并没有等待它在调用之前完成该函数。jQuery完成后不等待它完成
$.when(saveChanges()).done(showSignInPrompt());
我把console.log()放在它们的每一个里面,看看哪个先到达。瞧,后者先来。
我是用这种方法吗?
这里的SaveChanges的样子:
showSavedNotification_check = 1;
function saveChanges(bypassDeckSave) {
// bypassDeckSave = undefined - does not bypass
showSavedNotification_check = 1;
if(userid != 0) {
//values in database
var subjectID = $('.lib_folder_id').val(),
folderID = $('.lib_subject_id').val();
if(subjectID == 0 || folderID == 0) { //if database values null, ask for some
console.log("db deck location not saved, asked for it");
//values to set to
var setFolderID = $('.libDeckLocationModifierDiv .folders li.on').val() + 0,
setSubjectID = $('.libDeckLocationModifierDiv .subjects li.on').val() + 0;
if(isNaN(setFolderID) || isNaN(setSubjectID) || setFolderID == 0 || setSubjectID == 0) {
openDeckLocationDiv();
showSavedNotification_check = 0;
return;
}
}
}
var deck_id = $('.deck_id').val();
if(deck_id == 0) {
// create a new deck
createDeckThenSave();
return;
}
if(userid != 0) {
//values in database
var subjectID = $('.lib_folder_id').val(),
folderID = $('.lib_subject_id').val();
if(subjectID == 0 || folderID == 0) { //if database values null, ask for some
//values to set to
saveDeckLocation();
}
}
// removes empty rows
$('.editMain li').each(function() {
var one = $(this).find('.text1').val(),
two = $(this).find('.text2').val();
if(one == "" && two == "") {
//remove this row and remove value from updateSaveArray + add to delete array
var currentval = $(this).val();
var rowid = ".row_" + currentval;
updateSaveArray = jQuery.grep(updateSaveArray, function(value) {
return value != currentval;
});
$(rowid).remove();
updateDeleteArray[updateDeleteArray.length] = currentval;
}
});
if(bypassDeckSave == undefined) {
// save deck info to db
var deckname = $('.editDeckNameInput').val(),
cardCount = $('.editMain li.mainLi:visible').length,
deckTermLanguage = $('.selector.one select').val(),
deckDefinitionLanguage = $('.selector.two select').val(),
deckThirdBoxLanguage = $('.selector.three select').val(),
deckDescription = $('.editMoreDeckOptionsDiv textarea').val();
if($('.editMoreDeckOptionsSelector .onlyme').hasClass("on")) {
var viewPreferences = 1;
} else {
var viewPreferences = 0;
}
if($('.editUseThirdboxDiv').hasClass('on')) {
var thirdbox = 1;
} else {
var thirdbox = 2;
}
// console.log("deckInfoSave called");
$.ajax({
type: "POST",
url: "/edit/deckInfoSave.php",
data: {
pDeckid: deck_id,
pDeckname: deckname,
pCardCount: cardCount,
pDeckTermLanguage: deckTermLanguage,
pDeckDefinitionLanguage: deckDefinitionLanguage,
pDeckThirdBoxLanguage: deckThirdBoxLanguage,
pThirdbox: thirdbox,
pDeckDescription: deckDescription,
pViewPreferences: viewPreferences
}
}).done(function(data) {
// console.log(data);
// decksaved = 1;
});
}
// prepares edited card array
// gets all needed values and stores in holdSaveCardArray
var holdSaveCardArray = [];
for(i = 0; i < updateSaveArray.length; ++i) {
var currentCard_id = updateSaveArray[i],
rowidClass = ".row_" + currentCard_id,
text1val = $(rowidClass + " .text1").val(),
text2val = $(rowidClass + " .text2").val(),
text3val = $(rowidClass + " .text3").val();
cardOrder = $(".editMain li.mainLi:visible").index($(rowidClass)) + 1;
holdSaveCardArray[holdSaveCardArray.length] = {
"card_id": currentCard_id,
"text1val": text1val,
"text2val": text2val,
"text3val": text3val,
"cardOrder": cardOrder
};
}
// console.log(print_r(holdSaveCardArray));
// delete cards start
// deletes any card with an id in updateDeleteArray
$.ajax({
type: "POST",
url: "/edit/deleteCards.php",
data: {
pDeck_id: deck_id,
pDeleteArray: updateDeleteArray
}
}).done(function(msg) {
// $('.temp').append(msg);
updateDeleteArray = [];
});
// save cards to database
// loops through each card that had changes made to it
$.ajax({
type: "POST",
url: "/edit/saveCardsArray.php",
dataType: "JSON",
data: {
pDeck_id: deck_id,
pCardArray: holdSaveCardArray
}
}).done(function(data) {
for(var i = 0; i < data.length; i++) {
var temp_id = data[i]["temp_id"], // new id
card_key = data[i]["card_key"], // old id
currentClassName = 'row_' + temp_id,
currentClass = '.row_' + temp_id,
nextClassName = 'row_' + card_key;
$(currentClass).val(card_key);
$(currentClass).removeClass(currentClassName).addClass(nextClassName);
}
});
updateSaveArray = [];
// update order start // uses li value
updateOrderArray = [];
$('.editMain').find(".mainLi").each(function() {
var temp = $(this).val();
updateOrderArray[updateOrderArray.length] = temp;
});
$.ajax({
type: "POST",
url: "/edit/orderCards.php",
data: {
pUpdateOrderArray: updateOrderArray
}
}).done(function(msg) {
updateOrder = 0;
});
closeLibDLM();
console.log("closeLibDLM");
changeSaveStudyButton(1);
} //saveChanges function end
日志底部将在完成区域东西后打印。
既然你是做多的Ajax调用,你将有你的逻辑稍微改变了。你需要做的是收集这些承诺的数组。创建类似的东西。
var promises = [];
每当你做一个ajax调用时,将ajax承诺推送到该数组中,并在最后返回它。那么你的时间逻辑会稍微改变。
$.when.apply(jQuery, saveChanges()).done(...);
apply()会将数组返回并对待它,就好像您已将每个承诺都当作参数一样。
仅供参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
$.when
用于运行承诺。
Promise是一个运行异步操作并具有内部回调的函数。
在你的情况下,你需要修改saveChanges()
以便返回这种功能。
$.ajax
就是这样一个功能。
所以,你的代码应该是这个样子:
function saveChanges() {
...
return $.ajax(....)
}
那么你应该做的
$.when(function() { return saveChanges() })
.done(function() { return showSignInPrompt() })
在这种情况下,有多个ajax调用,是否有可能在'when'中将它们组合在一起?或者我需要为每个人分别制作谣言? –
不,你不能“跑”承诺。这不是'$ .when'的作用。承诺也不是功能。 – Bergi
您能向我们展示saveChanges实现吗? – drinchev
@drinchev上传,对不起,它有点长。 –
使用'.done(showSignInPrompt)'而不是'.done(showSignInPrompt())' - 你必须传递一个回调函数*!并用'then'代替'done'。 – Bergi