檢測刷新和重新加載之間的區別

我填寫了包含我的全名和地址的表單。當我點擊⌘R時，頁面刷新，但表格仍然包含我填寫的數據。檢測刷新和重新加載之間的區別

當我通過Google Chrome瀏覽器左上角的重新加載按鈕重新加載網頁時，表格將爲空。

如何通過JavaScript（或jQuery）檢測到這種差異？

我已經試過這樣：

$(window).on('load', function(){ 

    localStorage.setItem('gForm_isDone', '{"0":false,"1":false,"2":false,"3":false,"4":false,"5":false,"6":false,"7":false,"8":false,"9":false,"10":false,"11":false}'); 
    console.log('localStorage emptied'); 

    console.log(localStorage.getItem('gForm_isDone')); 

});

我的方案，我想清空localStorage的，但是當頁面重新加載，而不是當它僅刷新。

來源

2017-08-09 Maarten Wolfsen

我不能重現此問題的刷新/重載（對我來說總是清除對鉻和從來沒有在FF），但是你不能只是檢查輸入是否有一些價值？ – Kaiido

嗯，這是一個很好的主意！我真的很好奇，如果有另一種方式（感覺不太像解決方法）來檢查它，但在這種情況下，它可以工作得很好！感謝您的寶貴意見！ :) –

使用window.onbeforeunload功能檢查，如果被按下，處理該事件localStorage.clear()

window.onbeforeunload = function(){ 
var message = 'Are you sure you want to reload?'; 
    if (typeof evt == 'undefined') { 
    evt = window.event; 
    } 
    if (evt) { 
    evt.returnValue = message; 
    } 
    return message; 
}

來源

2017-08-09 07:40:13

一種可能的方式是使用

if (window.performance) { 
    console.info(performance.navigation.type); 
}

它將返回0或1檢測窗口的性能。 0用於頁面不重載或用空緩存調用。 1會告訴我們頁面使用ctrl+R或使用瀏覽器按鈕進行刷新。

if (window.performance) { 
    console.info("window performance work on browser"); 
} 
    if (performance.navigation.type == 1) { 
    console.info("This page is reloaded"); 
    } else { 
    console.info("This page is not reloaded or just called with empty cache"); 
    }

來源

2017-08-09 07:39:12

但硬刷新和簡單刷新沒有區別。（雖然這個評論可能只適用於FF，因爲我無法在Chrome上測試：我不能重複OP的行爲） – Kaiido

hard-refresh會導致您清空緩存並且通常不會執行簡單刷新。 –

這是相當漂亮，它並沒有真正檢查你如何重新加載，只有當緩存在網頁加載後清空 –

檢測刷新和重新加載之間的區別

回答

相關問題