歷史Api：如何告訴瀏覽器頁面正在加載？

我一直在使用歷史API，而我通過javascript/jquery異步加載頁面。我想知道如何告訴瀏覽器該網站正在加載，以便瀏覽器可以顯示加載圖片（例如Firefox中的旋轉輪）。歷史Api：如何告訴瀏覽器頁面正在加載？

編輯：

更具體：

如果我打開我的網站，網址的變化，頁面中的新內容被顯示，但Firefox不顯示紡車作爲信號，該頁面正在加載。

如果我從Facebook的時間線上打開圖片，圖像正在加載，url更改並且Firefox顯示要顯示的旋轉輪，圖像正在後臺加載。

我也想要那個旋轉輪！

來源

2012-11-13 Olli

那麼，異步請求知道正在加載的東西。你只需要在其他地方傳播事件。例如，使用beforeSend鉤：

$.ajax('/your_stuff', 
     beforeSend: function() { 
     $(document).trigger('loading'); 
     } 
     ....)

然後：

$(document).on('loading', function() { alert("request is loading");}

我勸你在同一時間更新與歷史API您的網址觸發事件。

來源

2012-11-13 08:48:27 ChuckE

此腳本顯示警告框。但我希望瀏覽器本身顯示該頁面正在加載。 – Olli

然後你制定了我們的問題有點不對。如果我理解正確，您想知道如何更新favicon以模擬「加載」狀態，同時執行ajax請求。 – ChuckE

https://gist.github.com/428626這可能會幫助你。現在您只需要知道「加載」圖標的存儲位置，這可能會因瀏覽器而異。所以，你可以讓你在任何地方工作，或者你可以通過瀏覽器找到位置，並在更新之前「瀏覽」瀏覽器。 – ChuckE

-1

我假設你正在使用jQuery爲你的AJAX標籤。您可以使用全局AJAX處理像$.ajaxStart()和$.ajaxComplete()這些不管會火，你自己的代碼中調用一個Ajax方法

$('#myLoadingDiv').ajaxStart(toggleLoading).ajaxComplete(toggleLoading); 

function toggleLoading(){ 
    $(this).toggle(); 
}

API參考http://api.jquery.com/ajaxStart/

我想從你的問題的措辭要能夠控制實際瀏覽器選項卡本身的加載圖像。你無法控制。使用您自己的圖片或網頁中的文字也是用戶更可見

編輯你必須爲這個編碼提供自己的加載動畫中的一個元素與id=myLoadingDiv工作

來源

2012-11-13 08:56:39 charlietfl

此腳本顯示一個警告框。但我希望瀏覽器本身顯示該頁面正在加載。 – Olli

請解釋你的意思是'瀏覽器本身顯示，該頁面正在加載'。此外，它不是一個警告框...可以是任何你想放在任何頁面上的html，你可以用任何你想要的方式爲它製作動畫 – charlietfl

哦，對不起，這個評論指的是其他答案 - 不是你的。我測試了你的腳本，但Firefox中的「旋轉輪」沒有出現。我編輯我的問題進一步解釋。 – Olli

我發現這些問題的答案：

How to have AJAX trigger the browser's loading

var i = $('<iframe>'); 
console.log(i); 
i.appendTo('body'); 
function start() { 
    i[0].contentDocument.open(); 
    setTimeout(function() { 
     stop(); 
    }, 1000); 
} 
function stop() { 
    i[0].contentDocument.close(); 
    setTimeout(function() { 
     start(); 
    }, 1000); 
} 

start();

來源：jsFiddle

該腳本創建一個iframe，由ajax.start & ajax.stop事件觸發。

來源

2012-11-13 12:39:30 Olli

在Chrome中無效:-( – Frodik

歷史Api：如何告訴瀏覽器頁面正在加載？

回答

相關問題