如何使用JavaScript重新加载页面

Question

如何使用JavaScript重新加载页面？

我需要一个在所有浏览器中都可用的方法。

- Resh

Answer 1

JavaScript 1.2及更高版本

简短版：

location.reload();

长版本（与短版本相同）：

window.location.reload();

一些浏览器支持一个可选的布尔参数，可以强制清除缓存（类似于Ctrl+Shift+R），但这是非标准的、支持和文档化都很差，通常不应该使用：

//Force a hard reload to clear the cache if supported by the browser
window.location.reload(true);

JavaScript 1.1

window.location.replace(window.location.pathname + window.location.search + window.location.hash);
// does not create a history entry

JavaScript 1.0

window.location.href = window.location.pathname + window.location.search + window.location.hash;
// creates a history entry

- gianebao

---

看起来 location.reload(forceReload: boolean) 现在被弃用了（仅限于 true/false 参数），尽管它可能仍然可以工作。 - Andrew

据我所知，它从未成为任何规范的一部分。为了强制重新加载（绕过缓存），将一个不被使用的随机参数作为 URL 的一部分是一种可行的解决方案。也许可以像这样：nocache=' + (new Date()).getTime()。 - StanE

Answer 2

location.reload();

查看此MDN页面获得更多信息。

如果您是在onclick之后刷新，则需要直接返回false。

location.reload();
return false;

- Lekensteyn

---

location.reload() 和 window.location.reload() 有什么区别？ - Raptor

通常情况下，在Web浏览器的上下文中，location与window.location是相同的，因为window是全局对象。 - Lekensteyn

我更喜欢使用window.location.reload();以提高可读性，因为 location 可能是一个局部变量 - 而通常会避免使用名称为 window 的变量。 - Yeti

在我的意见中，处理程序中的 return false; 并不是必需的：因为 reload 覆盖了任何进一步的处理，对吗？ - ToolmakerSteve

为什么需要在之后返回false？ - Tedious

Answer 3

我正在寻找与使用POST请求检索的页面重新加载相关的一些信息，例如在提交 method =“post” 表单后。

要重新加载页面并保留POST数据，请使用：

window.location.reload();

重新加载页面并放弃POST数据（执行GET请求），请使用以下代码：

location.reload(true)

window.location.href = window.location.href;

希望这能帮助到其他寻找同样信息的人。

- Starwarswii

---

感谢您的回答，其中包括重新加载使用 POST 请求检索的文档的参考。 - Christopher Schultz

良好的区分GET和POST方法。 - Hassan Baig

如果当前URL包含#，则window.location.href = window.location.href不会重新加载页面。如果您不需要它，可以删除散列(#)：window.location.href = window.location.href.split('#')[0];。 - Roland Starke

Answer 4

您可以使用 window.location.reload(); 完成此任务。虽然有很多方法可以实现此操作，但我认为使用JavaScript重新加载相同的文档是适当的方法。以下是解释：

JavaScript中的 window.location 对象可用于

• 获取当前页面地址（URL）
• 将浏览器重定向到另一个页面
• 重新加载相同的页面

window: 在JavaScript中表示浏览器中打开的窗口。 location: 在JavaScript中包含有关当前URL的信息。 location 对象类似于 window 对象的一部分，并通过 window.location 属性调用。 location 对象有三种方法：

1. assign(): 用于加载新文档
2. reload(): 用于重新加载当前文档
3. replace(): 用于替换当前文档为新文档

因此，在这里我们需要使用 reload()，因为它可以帮助我们重新加载相同的文档。

所以请使用 window.location.reload();。

在此之外，如果您想要指示浏览器直接从服务器而不是从缓存中检索页面，则可以将 true 参数传递给 location.reload()。此方法与所有主要浏览器兼容，包括IE、Chrome、Firefox、Safari和Opera。

在线演示请见： jsfiddle。

- Nikhil Agrawal

---

啊哈！replace()原来就是我正在寻找的解决方案，因为我需要通过轻微更改查询字符串重新加载页面。 - Bernard Hymmen

从w3schools：assign()和replace()之间的区别在于，replace()会从文档历史记录中删除当前文档的URL，这意味着无法使用“返回”按钮导航回原始文档。 - pasaba por aqui

Answer 5

尝试：

window.location.reload(true);

将参数设置为“true”将从服务器重新加载最新版本。如果不设置，将从缓存中提供页面。

可在MSDN和Mozilla文档中找到更多信息。

- Orane

---

如果我想刷新外部网页www.xyz.com/abc怎么办？ - DoIt

@开发者：你应该尝试使用后面提到的“替换”。 - anon

@Orane：我特别喜欢这个答案的简洁和实用性，它提供了很多选项来满足问题的需求。同时，感谢您在这种情况下提供了一个权威的参考链接，以备将来参考，因为每个浏览器都有自己的JS引擎进行渲染...我认为这个问题非常普遍，应该取决于你想要做什么，否则网络参考："http://www.phpied.com/files/location-location/location-location.html" 可能完全满足这个问题。然而，这个答案对我很有帮助 ;) - anon

还有效吗？这两个链接都没有提到重新加载的任何参数。 - Rüdiger Schulz

第二个（真正的）参数已被弃用。 - nick

Answer 6

这对我很有效：

function refresh() {    
    setTimeout(function () {
        location.reload()
    }, 100);
}

http://jsfiddle.net/umerqureshi/znruyzop/

- Umer Qureshi

---

在我看来，这是更可取的，因为它避免了在服务器端进行循环条件。 - ILMostro_7

我特别欣赏超时功能的包含，因为在刷新发生之前，我仍然希望查看一条消息。赞！ - Matt Cremeens

你可以将不同的值作为setTimeout函数的第二个参数进行设置，但它不起作用，重新加载会立即发生，如何解决？ - O.Kuz

@O.Kuz 不这么认为。假设您将值设置为5000ms，那么重新加载将在5秒后发生。请参见http://jsfiddle.net/umerqureshi/znruyzop/446/。 - Umer Qureshi

Answer 7

要使用JavaScript重新加载页面，请使用：

window.location.reload();

- Girish Ninama

Answer 8

如果您输入

window.location.reload(true);

如果在页面的开头没有其他条件来限制代码运行，那么页面将会加载并且不断重载直到你关闭浏览器。

- Joe Devlin

---

好吧，或者直到你打开另一个URL。这可能取决于浏览器处理连续页面重新加载的能力。 - adamdunson

那取决于您正确指定的位置。我们仅是在这里提到，也许锚元素不是执行诸如重新加载页面之类的操作的直观元素。建议：我们应该依赖另一个 UI 对象作为点击事件的目标。您可以在页面加载后通过针对 div 进行装饰来使用 jQuery 执行此操作，例如，如果您对其进行 css 装饰。它取决于您想要做什么。在这种情况下，与其使用输入类型按钮，不如使用按钮，如果我们不打算向后端应用程序传递参数，则似乎更合适。 - anon

<button onclick="javascript:window.location.reload(true);">刷新</button> - anon

Answer 9

location.href = location.href;

- guilin 桂林

---

现代浏览器会忽略这个代码，因为 href 没有改变，所以不需要重新加载。你只应该在旧版本的浏览器中使用这段代码作为回退方案，用于重新加载页面：(location.reload ? location.reload() : location.href = location.href)。 - Radek Pech

@RadekPech 哪些旧浏览器不支持 location.reload()？ - Matthias

Answer 10

最短的 (更多)

history.go()

- Kamil Kiełczewski

---

这对于提交/表单数据有什么影响？例如使用“window.location.reload(true);”（保留数据）和“window.location.href = window.location.href;”（丢弃数据）。 - tcables