Question

我想在每次执行ajax调用时显示加载图标/图像。 以我为例，我的代码仅显示一次图像，仅此而已。即使在for循环中有多个ajax调用，该图像也只显示一次，并在第一个ajax调用的第一个成功状态下消失。

这是我的代码：

function ajaxCall(ajaxObject){ 
     $.ajax({
        type: 'GET',
        url: 'url/' + ajaxObject,

        beforeSend: function(){
            $("#someid").LoadingOverlay("show");
        },
        success: function (imagesList) {
            showGenerated(imagesList);
        },
        complete:function(){
            $("#someid").LoadingOverlay("hide", true);

        },
        error: function () {
            console.log('error imaging processing');
        }
    });
} 
jsObject = JSON.parse(listImages.attr("data-images"));

    for (i = 0; i < jsObject.length; i++) {
        ajaxCall(jsObject[i].filesID);
    }

我也尝试使用$(document).ajaxStart(function(){}).ajaxStop(function(){});，但是结果相同，“加载微调器”仅显示一次，并且在所有AJAX调用都消失时消失已完成...

chrome调试中的“网络”标签显示了多个ajax获取请求，因此有更多的ajax调用，但微调器/加载似乎只是一个ajax调用。

因此，我希望图像在每次进行新的ajax调用时都显示和消失。

Answer 1

您必须为每个ajax调用执行此操作，在ajax调用中，您需要显示它，并在获得响应后将其隐藏起来，就像您现在所做的那样。

另一种可能性是您需要使用以下紧随其后的ajax函数 ajaxStart 和 ajaxStop

将其全局添加

$('#loading-image').bind('ajaxStart',
 function(){
$(this).show();
}).bind('ajaxStop',function(){
$(this).hide();});

您可以在AjaxStart

中找到文档

每次使用jQuery进行新的ajax调用时，如何显示“加载微调框”？

1 个答案: