加载gif以在执行所有ajax脚本时隐藏

时间:2013-06-11 03:15:14

标签: javascript jquery ajax

我已经尝试了几种方法来显示我的加载gif,然后在ajax脚本加载完成后隐藏。我试过$ j(window).load,我正在尝试将hide()函数放在不同位置的加载gif div元素上。在函数中的其他脚本加载之前,我无法弄清楚如何显示加载gif。你能看出我能做些什么吗? (如果我注释掉所有$ j('#loading')。hide()我确实得到了加载的gif)。 SimpleWithAttrPrices函数执行ajax脚本并返回值。

function updatePrices(IDs){
    var product_id= <?=$product_id ?>;
    var qty= parseInt($j("#qtyUpdateBox input").val());
    $j('#loading').show();

    if (qty==1){
        function sendRequest(i,basePrice) {
            var optionSelectionArray = currentlySelectedAttributes(IDs[i]);
            simpleWithAttrPrice(optionSelectionArray, function(data) {
                //var vendor = IDs[i];
                var basePrice = parseFloat(roundDollar(data));
                $j('.details'+IDs[i]+ ' .priceBlock').empty();      
                $j('.details'+IDs[i]+ ' .priceBlock').append('<span>'+formatCurrency(basePrice,"$")+'</span>');
                $j('.details'+IDs[i]+ ' .priceBlock').append('<input type="hidden" name="customPrice" value="' + basePrice + '"/>');
            });
        }//end sendRequest

        for(i=0; i<IDs.length; i++)
        {   
            sendRequest(i);
            if(i=IDs.length-1){
                $j('#loading').hide();
            }
        }

        //$j('#loading').hide();
}//end if
//... THE REST OF THE FUNCTION NOT APPLICABLE

2 个答案:

答案 0 :(得分:2)

您可以使用ajaxStart()ajaxStop()在ajax请求期间显示/隐藏加载动画。

就这么简单:

$(document).ajaxStart(function() {
  $j('#loading').show();
})
.ajaxStop(function() {
  $j('#loading').hide();
});

答案 1 :(得分:0)

如果您可以轻松跟踪发出的请求数量,则可以计算在隐藏#loading元素之前调用.ajaxSuccess()的次数。