3

我知道有很多与 chrome 和 popstate 事件相关的主题,但是在将 chrome 升级到 35 版后,我遇到了一个新主题。

情况是这样的:

我有一个包含类别和过滤器的列表页面,在您选择类别后,页面等内容通过 ajax 重新加载,一切都由历史 API 处理,工作正常。

但是,当您转到列表中项目的详细信息页面时-标准请求,整个页面被重新加载-然后按浏览器上的后退按钮,您可以在您最后一次单击项目但随后触发 popstate 的位置看到列表页面(我没有'不要在这里谈论初始页面加载时的 chrome popstate,因为版本 34 中的 popstate 不再在 init 上触发),并且由于我之前提到的处理类别的代码,整个页面被重新加载。

所以问题是chrome 35在我们按下后退按钮后触发popstate事件,我的问题是:

如何在用户从详细信息页面返回到我的列表页面以不重新加载此事件后检测到此事件被触发。

我尝试使用文档对象引用者等,但是当它第一次看起来像解决方案时,总是会出现它不起作用的情况。

4

1 回答 1

0

我一直遇到这个问题。我的解决方案有点小题大做,但除此之外它似乎工作得很好。我发现在设置我的 onpopstate 处理程序之前等待 150 毫秒足以等待 Chrome 运行其初始 onpopstate 处理程序,您可以使用它来发挥您的“优势”。例如,要检测是否运行了初始 onpopstate:

// wait for page to load
$(function() {
  var no_initial_onpopstate = true;
  var enabled = true;

  window.onpopstate = function() {
    if(!enabled) return;
    console.log("detected initial onpopstate");
    no_initial_onpopstate = false;
  }

  setTimeout(function() {
    enabled = false;
    console.log("No initial onpopstate: ", no_initial_onpopstate);

    // no_initial_onpopstate indicates if the browser emitted an initial
    // onpopstate event. Do with that information what you will

    // 150ms delay seems to be the "magic number" to wait for Chrome to
    // run all of its initial onpopstate handlers (in my tests on localhost, at least)
  }, 150);
});

因此,据我所知,在浏览器的 DOM 就绪事件 150 毫秒后设置您的“onpopstate”回调将跳过 chrome 的初始 onpopstate。

于 2014-08-13T07:49:28.523 回答