如何使用 jQuery 刷新页面?

如何使用 jQuery 刷新页面?

答案

使用location.reload()

$('#something').click(function() {
    location.reload();
});

reload()函数采用一个可选参数,可以将其设置为true以强制从服务器而不是从缓存重新加载。该参数默认为false ,因此默认情况下该页面可能会从浏览器的缓存中重新加载。

即使没有 jQuery,这也应适用于所有浏览器:

location.reload();

多种使用 JavaScript 刷新页面的无限方式:

  1. location.reload()
  2. history.go(0)
  3. location.href = location.href
  4. location.href = location.pathname
  5. location.replace(location.pathname)
  6. location.reload(false)

    如果需要再次从 Web 服务器提取文档(例如,文档内容动态变化的地方),则将参数传递为true

您可以继续执行具有创意的列表:

var methods = [
  "location.reload()",
  "history.go(0)",
  "location.href = location.href",
  "location.href = location.pathname",
  "location.replace(location.pathname)",
  "location.reload(false)"
];

var $body = $("body");
for (var i = 0; i < methods.length; ++i) {
  (function(cMethod) {
    $body.append($("<button>", {
      text: cMethod
    }).on("click", function() {
      eval(cMethod); // don't blame me for using eval
    }));
  })(methods[i]);
}
button {
  background: #2ecc71;
  border: 0;
  color: white;
  font-weight: bold;
  font-family: "Monaco", monospace;
  padding: 10px;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.5s ease;
  margin: 2px;
}
button:hover {
  background: #27ae60;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

我想有很多方法可以起作用:

  • window.location.reload();
  • history.go(0);
  • window.location.href=window.location.href;

要使用 jQuery 重新加载页面,请执行以下操作:

$.ajax({
    url: "",
    context: document.body,
    success: function(s,x){
        $(this).html(s);
    }
});

我在这里使用的方法是 Ajax jQuery。我在Chrome 13 上进行了测试。然后将代码放入处理程序中,该处理程序将触发重新加载。 URL"" ,表示此页面

如果当前页面是通过 POST 请求加载的,则可能要使用

window.location = window.location.pathname;

代替

window.location.reload();

因为window.location.reload()如果在由 POST 请求加载的页面上被调用,将提示您进行确认。

问题应该是

如何使用JavaScript刷新页面

window.location.href = window.location.href; //This is a possibility
window.location.reload(); //Another possiblity
history.go(0); //And another

您选择太多了。

您可能要使用

location.reload(forceGet)

forceGet是布尔值和可选的。

默认值为 false,它将从缓存中重新加载页面。

如果要强制浏览器从服务器获取页面以摆脱缓存,则将此参数设置为 true。

要不就

location.reload()

如果您想快速轻松地进行缓存。

三种与缓存相关行为不同的方法:

  • location.reload(true)

    在实现location.reload()forcedReload参数的浏览器中,通过获取页面及其所有资源(脚本,样式表,图像等)的新副本来重新加载。不会从缓存中提供任何资源 - 从服务器获取新副本,而不在请求中发送任何if-modified-sinceif-none-match头。

    等效于用户在可能的情况下在浏览器中执行 “硬重装”。

    请注意,在 Firefox(请参阅MDN )和 Internet Explorer(请参阅MSDN )中支持将true传递给location.reload()但该方法不受普遍支持,也不属于W3 HTML 5 规范W3 草案 HTML 5.1 规范WHATWG HTML 生活标准

    在不支持的浏览器(例如 Google Chrome)中, location.reload(true)行为与location.reload()相同。

  • location.reload()location.reload(false)

    重新加载页面,获取页面 HTML 本身的最新非缓存副本,并对浏览器已缓存的任何资源(例如脚本)执行RFC 7234重新验证请求, 即使它们是新鲜的 RFC 7234 仍允许浏览器提供他们没有重新验证。

    据我所知,确切地说,浏览器在执行location.reload()调用时应如何利用其缓存。我通过实验确定了上述行为。

    这等效于用户只需在其浏览器中按下 “刷新” 按钮即可。

  • location = location (或涉及分配location或其属性的无限多种其他可能的技术)

    仅在页面的 URL 不包含虚假 / 散列的情况下才有效!

    重新加载页面,而无需重新获取或重新验证缓存中的任何 资源。如果页面的 HTML 本身是新鲜的,这将重新加载页面而不执行任何 HTTP 请求。

    从缓存的角度来看,这等效于用户在新标签页中打开页面。

    但是,如果页面的 URL 包含哈希,则该哈希将无效。

    再次,据我所知,这里的缓存行为是不确定的。我通过测试确定了它。

因此,总而言之,您要使用:

  • location = location最大限度地利用缓存的位置, 只要页面的 URL 中没有散列,在这种情况下将无法使用
  • location.reload(true) ,无需重新验证即可获取所有资源的新副本(尽管不受普遍支持,并且在某些浏览器(例如 Chrome)中,其行为与location.reload()
  • location.reload()忠实地再现用户单击 “刷新” 按钮的效果。

window.location.reload()将从服务器重新加载,并再次加载所有数据,脚本,图像等。

因此,如果您只想刷新 HTML,则window.location = document.URL将返回得更快,访问量也更少。但是,如果 URL 中包含井号(#),它将不会重新加载页面。