添加加載GIF到一個Ajax請求

我已經看了好幾個答案爲此，the most informative of which說：「只要你開始AJAX請求顯示它」，然後「再隱藏圖像，一旦請求已完成」。我會怎麼做？它是這樣的：添加加載GIF到一個Ajax請求

showGif(); 
$.ajax({ 
    url: whatever, 
    success: function(data) { 
     hideGif(); 
    } 
});

或者有沒有更好的方法呢？如果ajax請求不成功怎麼辦？

來源

2014-05-09 Bluefire

是的，你是對的 –

這是你應該怎麼走。你也可以把它放在'complete'中，這樣它就會觸發它是成功的回調還是錯誤的回調。 – JohnP

@JohnP啊，那可能是我需要的。無論發生什麼情況，請求完成後，「完成」都會觸發嗎？ – Bluefire

我傾向於風格的加載GIF使用常規的HTML和CSS頁面，但默認情況下我將它設置爲隱藏。然後，您可以使用AJAX事件處理程序來隱藏和顯示您加載GIF無需重複任何代碼：

$(document).bind("ajaxSend", function(){ 
    $("#loading").show(); 
}).bind("ajaxComplete", function(){ 
    $("#loading").hide(); 
});

來源

2014-05-09 09:45:24 edcs

我建議在always運行這使得它被隱藏在請求是否是成功還是失敗：

showGif(); 
$.ajax({ 
    url: whatever, 
    success: function(data) { 
     // 
    } 
}).always(function(){ 
    hideGif(); 
});

來源

2014-05-09 09:44:00 Curt

'$ .always'和'complete'有什麼區別？ – Bluefire

'complete'已棄用。「總是」是新的首選方法。棄用聲明：從jQuery 1.8開始，jqXHR.success（），jqXHR.error（）和jqXHR.complete（）回調已被棄用。要爲他們的最終準備拆除你的代碼，使用jqXHR.done（），jqXHR.fail（），和jqXHR.always（）instead.' http://api.jquery.com/jquery.ajax/ – Curt

，如果你在阿賈克斯success做hideGif();是沒有問題的。但我建議你把它做成ajax complete。

Ajax的完整：一個功能的請求完成（成功和錯誤回調之後被執行）時被調用。

showGif(); 
    $.ajax({ 
     url: whatever, 
     success: function(data) { 
      //-- Do your other stuff here 
     }, 
     complete: function() { 
      hideGif(); 
     } 
    });

來源

2014-05-09 09:44:58

還是有這樣做的更好的辦法？

我不這麼認爲。

如果Ajax請求不成功怎麼辦？

您可以擴展此方法以在發生錯誤時顯示錯誤消息。

showGif(); 
$.ajax("example.php") 
    .done(function() { 
    // success 
    }) 
    .fail(function() { 
    // error 
    alert("error"); 
    }) 
    .always(function() { 
    hideGif(); 
    });

來源

2014-05-09 09:44:58

添加加載GIF到一個Ajax請求

回答

相關問題