当有人试图刷新页面时,我想检查一下。

例如,当我打开一个页面什么都没有发生,但当我刷新页面时,它应该显示一个警告。


当前回答

我写了这个函数来同时检查两个方法,使用旧的window.performance.navigation和新的performance.getEntriesByType("navigation"):

function navigationType(){

    var result;
    var p;

    if (window.performance.navigation) {
        result=window.performance.navigation;
        if (result==255){result=4} // 4 is my invention!
    }

    if (window.performance.getEntriesByType("navigation")){
       p=window.performance.getEntriesByType("navigation")[0].type;

       if (p=='navigate'){result=0}
       if (p=='reload'){result=1}
       if (p=='back_forward'){result=2}
       if (p=='prerender'){result=3} //3 is my invention!
    }
    return result;
}

结果描述:

0:点击链接,在浏览器地址栏输入URL,提交表单,点击书签,通过脚本操作初始化。

1:点击Reload按钮或使用Location.reload()

2:使用浏览器历史记录(Bakc和Forward)。

3:预渲染活动,如<link rel="prerender" href="//example.com/next-page.html">

4:任何其他方法。

其他回答

if

event.currentTarget.performance.navigation.type

返回

0 =>用户刚刚输入了一个Url 1 =>页面重新加载 2 =>返回按钮单击。

⚠️⚠️⚠️window.performance.navigation.type已弃用。请看Илья Зеленько的回答。


了解页面是否实际被重新加载的更好方法是使用大多数现代浏览器支持的导航器对象。

它使用导航计时API。

//检查导航定时API支持 If (window.performance) { Console.info ("window.performance works fine on this browser"); } console.info (performance.navigation.type); 如果(performance.navigation。type == performance.navigation.TYPE_RELOAD) { console.info("此页面已重新加载"); }其他{ console.info("此页面未重新加载"); }

来源:导航定时API

我在JavaScript检测页面刷新中找到了一些信息。他的第一个建议是使用隐藏字段,这些字段往往是通过页面刷新存储的。

function checkRefresh() { if (document.refreshForm.visited.value == "") { // This is a fresh page load document.refreshForm.visited.value = "1"; // You may want to add code here special for // fresh page loads } else { // This is a page refresh // Insert code here representing what to do on // a refresh } } <html> <body onLoad="JavaScript:checkRefresh();"> <form name="refreshForm"> <input type="hidden" name="visited" value="" /> </form> </body> </html>

我写了这个函数来同时检查两个方法,使用旧的window.performance.navigation和新的performance.getEntriesByType("navigation"):

function navigationType(){

    var result;
    var p;

    if (window.performance.navigation) {
        result=window.performance.navigation;
        if (result==255){result=4} // 4 is my invention!
    }

    if (window.performance.getEntriesByType("navigation")){
       p=window.performance.getEntriesByType("navigation")[0].type;

       if (p=='navigate'){result=0}
       if (p=='reload'){result=1}
       if (p=='back_forward'){result=2}
       if (p=='prerender'){result=3} //3 is my invention!
    }
    return result;
}

结果描述:

0:点击链接,在浏览器地址栏输入URL,提交表单,点击书签,通过脚本操作初始化。

1:点击Reload按钮或使用Location.reload()

2:使用浏览器历史记录(Bakc和Forward)。

3:预渲染活动,如<link rel="prerender" href="//example.com/next-page.html">

4:任何其他方法。

在控制台添加以下脚本:

window.addEventListener("beforeunload", function(event) { 
     console.log("The page is redirecting")           
     debugger; 
});