Ajax制作Ajax循环
Ajax制作Ajax循环
提问于 2019-10-03 09:57:34
我想做的是：
首先，Ajax正在上传csv文件并获取所有产品列表。然后，在成功的情况下，它会通过循环调用另一个ajax来上传这些产品。
问题：
当它通过循环，它冻结浏览器和等待直到每一个产品将上传，然后它打印出ID的。
我需要什么：
为了摆脱冻结浏览器，当它可以打印每个产品上传后的每个ID。
代码：
var data = new FormData();
data.append('file', jQuery('#item_data')[0].files[0]);
data.append('action', 'csv_upload');
jQuery.ajax({
url: ajaxurl,
data: data,
timeout: 3000,
cache: false,
contentType: false,
processData: false,
type: 'POST',
dataType: 'json',
success: function (data) {
jQuery( ".wrap .all" ).html(data.information.length);
jQuery.each(data.information, function (i, elem) {
add_item(elem, i);
});
jQuery( "#results" ).append( "<p style='color:green;'>The end!</p>" );
}
});
function add_item(elem, i){
var data = new FormData();
data.append('action', 'product_upload');
data.append('file_cont', JSON.stringify(elem));
jQuery.ajax({
async: false,
url: ajaxurl,
data: data,
type: 'POST',
processData: false,
contentType: false,
dataType: 'json',
success: function (response) {
jQuery( "#results" ).append( "<span>"+ data.message +"</span>" );
}
});
jQuery( ".wrap .count" ).html(i+1);
}回答 1
Stack Overflow用户
回答已采纳
发布于 2019-10-03 10:01:07
var data = new FormData();
data.append('file', jQuery('#item_data')[0].files[0]);
data.append('action', 'csv_upload');
jQuery.ajax({
url: ajaxurl,
data: data,
timeout: 3000,
cache: false,
contentType: false,
processData: false,
type: 'POST',
dataType: 'json',
success: function(data) {
jQuery(".wrap .all").html(data.information.length);
add_item(data.information, data.information[0], 0);
}
});
function add_item(info, elem, i ) {
var
data = new FormData();
data.append('action', 'product_upload');
data.append('file_cont', JSON.stringify(elem));
jQuery.ajax({
url: ajaxurl,
data: data,
type: 'POST',
processData: false,
contentType: false,
dataType: 'json',
success: function(response) {
if (info.length >= i + 1) {
jQuery("#results").append("<span>" + data.message + "</span>");
add_item(info, info[i + 1], i + 1);
jQuery(".wrap .count").html(i + 1);
}
}
});
if(info.length == i){
jQuery( "#results" ).append( "<p style='color:green;'>The End!</p>" );
}
}您可以递归地这样做，因为设置async: false将在执行下一条指令之前等待请求完成。
更新:删除async: false，并添加“End”消息更正。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58216678
复制相关文章
相似问题
腾讯云开发者
