如何爲頁面之間的轉換設置加載圖標？

Question

$(window).load(function() { 
    $('#loading').hide(); 
    $('#container').show(); 
}); 

在我所有的php文件中，我都有上面提到的顯示加載圖標的代碼，直到頁面加載。例如：如果我執行index.php，將顯示加載圖標，直至index.php獲得滿載。如果在重定向時將其重定向到example.php，則不會顯示加載圖標，其完全空白。如果完全重定向，則會顯示加載圖標，直到該頁面完全加載。

預計： 當重定向到下一頁時，同時我也需要加載圖標來顯示。

so如何在頁面轉換之間顯示加載圖標？

Answer 1

訣竅是當頁面被卸載時立即啓動加載圖標。然後當新頁面被加載時，加載圖標必須立即再次顯示，只有當新頁面被完全加載時才能隱藏圖標。

// Show the icon immediatly when the script is called. 
$('#loading').show(); 

// show the icon when the page is unloaded 
$(window).on('beforeunload', function(event) { 
    $('#loading').show(); 
}); 

// hide the icon when the page is fully loaded 
$(window).on('load', function(event) { 
    $('#loading').hide(); 
});