在Jquery中測量加載時間

我對我製作的Javascript文件有疑問。它確保超鏈接在div中打開，而不是在新選項卡中打開。不過，我也做了一個非常簡單的文本包含，以便在頁面加載時顯示。在Jquery中測量加載時間

$(document).ready(function() { 
    $('a').on('click', function(e){ 
     e.preventDefault(); 
     var page_url = $(this).prop('href'); 
     var loading = 
     $('#content') 
     .html('<h2>The page is loading. A second please.</h2>') 
     .load(page_url); 
    }); 
});

但是，有些頁面的加載速度比其他頁面快得多。換句話說，在一些頁面中使用這個腳本是非常有用的，但是當一個頁面被立即加載時，它只是非常煩人。

是否有可能測量'負載'所需的時間，並相應地顯示html？（我正在考慮類似的問題：「如果時間加載> 1000 .html（'blabla'）/ Else」）。

來源

2014-01-18 SpyFox

這是可能的，但不是時間已過，然後添加加載消息有點晚。 – adeneo

您可能會在超過500毫秒後顯示加載消息，以便非常快速加載的腳本永不顯示消息。 –

基於我上面的評論，我放在一起jsfiddle在http://jsfiddle.net/harveyramer/SkHb9/6/ –

你可以做這樣的事情：

var timer = setTimeout(function() { 
    $('#content').html('<h2>The page is loading. A second please.</h2>'); 
    timer = null; 
}, 1000); 
$('#content').load(page_url, function() { 
    if (timer) { 
     clearTimeout(timer); 
    } 
});

來源

2014-01-19 00:15:34

同胞的Google，結合我上面的意見和答案提供瞭解決方案。我所做的是以下幾點：不是不顯示，如果網頁被一秒鐘內加載加載消息，我確信它至少顯示至少第二：

$(document).ready(function() { 
$('a').on('click', function(e){ 
    e.preventDefault(); 
    $('#content').html("<div id='status' class='status'></div>"); 
    $('#status').html('<h2>The page is loading. A second please.</h2>'); 
    var page_url = $(this).prop('href'); 
    var loadingMsg = setTimeout(function(){ 
      $('#content').load(page_url, function(){ 
       clearTimeout(loadingMsg); 
       $('#status').html(); 
      }); 
     },1000); 
    }); 
});

爲什麼我這樣做的原因，是因爲我無法獲得一致的超時功能。有時候它可以很好地工作，但有時屏幕會凍結，在加載頁面之前不會顯示任何內容。現在，它至少顯示一秒，如果加載需要更多，它將顯示直到頁面加載。感謝您的回答，我希望這可以幫助有類似問題的人！

來源

2014-01-19 15:28:26 SpyFox

在Jquery中測量加載時間

回答

相關問題