问题标签 [html5-history]

我正在使用 history.js，并且想在 url 更改时通过 ajax 调用内容。我有这个工作，但问题是我需要页面根据状态更改时加载的 URL 做出不同的响应。例如，在本地范围内，我需要将与右侧导航中的 URL 相关的页面加载到它们旁边的内容区域中。如果 URL 更改为我所在部分之外的范围，我希望 ajax 调用将页面加载到包含整个部分的容器中，包括右侧导航。如何使用 history.js 可靠地对 URL 做出不同的响应？

例子：

我有一些代码可以在单击右侧导航项时更改 URL：

...以及一些在 URL 更改时加载不同内容的代码：

但是，如果我希望onstatechange事件处理程序在新 url 不在此子部分之外时做出不同的反应怎么办？如果我希望它替换$('#primary-content').html()而不是$('#sub-content').html()新 URL 导致 AJAX 请求提取不属于的内容$('#sub-content')怎么办？：

基本 HTML：

当 URL 更改为： www.example.com/sub-section/page.html

当 URL 更改为： www.example.com/page.html

您如何使用 安全地确定 URL 何时转到不同的部分history.js？你对这种变化有何反应？

我正在开发一个使用 Backbone 的 HTML5 History 选项的网络应用程序。为了避免在客户端和服务器上编写所有代码，我使用这种方法将每个请求路由到 index.html

我想知道是否有办法让 Twitter Cards 与此设置一起使用，因为目前它无法读取页面，因为所有内容都是使用 Javascript 动态加载的。

我正在考虑使用用户代理来检测它是否是 TwitterBot，如果是，则提供带有所需元标记的页面的静态版本。这行得通吗？

谢谢。

我正在尝试使用填充当前选定选项卡的索引

我在 jquery 中有一个 popstate 事件的处理程序，它以编程方式切换 jquery ui 选项卡。

这工作正常，浏览器和我可以使用后退和前进按钮在选项卡之间切换。也适用于两层标签。

但在某些情况下，我想将其他状态推送到堆栈。所以我做了以下事情：

内容在我将其推送到历史之前和之后看起来都不错。用 console.log(history.state); 检查 还尝试检查 chrome 控制台。

但是在我的 popstate 处理程序中，我没有看到对象 event.originalEvent.state 上的 targetId、tabSelected 属性。我在对象上看到了正确的 tabSelected 值，但由于某种原因，我看到了一个修剪状态。

在 Chrome 和 Firefox 中检查。无法获取正确的内容。有什么想法可能是错的吗？提前致谢。

更新

还尝试在每个 pushstate 上增加一个全局变量并将其添加到状态中。事实证明，对于我提到的特定情况，全局变量的值变为 48 而不是 49，这意味着它正在接收最后一个事件。我没有看到我的 popstate 处理程序在两者之间被调用。不知道发生了什么。

另一个更新

当我调用 history.pushState(content, null, "") 两次它工作正常。（仅在一个地方，在另一个地方我仍然称之为一次）。看起来由于某种原因，浏览器正在返回最后一个状态。显然我的代码有问题，因为这种解决方法适用于 chrome 和 firefox。

我正在构建一个使用 AJAX 和pushState/replaceState在非 JavaScript 后备（http://biologos.org/resources/find）之上的工具。基本上，它是一个搜索工具，它返回一个真实的 HTML 链接列表（单击一个链接会带您离开该工具）。

我正在使用onpopstate，因此用户可以浏览由pushState. 当从真实链接（不是用实际浏览器导航创建而是由实际浏览器导航创建的）导航返回时也会触发此事件。我不想让它在这里开火。pushState

所以这是我的问题：如何区分onpopstate来自pushState历史项目的事件与来自真实导航的事件？

我想做这样的事情：

我试过onpopstate 处理程序 - ajax 后退按钮但没有运气:(

提前致谢！

编辑： 这里的一个问题是不同浏览器处理onpopstate事件的方式。以下是似乎正在发生的事情：

铬合金

• 触发onpopstate真实和虚拟事件_
• 实际上重新运行javascript（所以设置loaded=false实际上会测试为假）
• 上面链接中的解决方案确实有效！

火狐

• 仅onpopstate在虚拟事件上触发
• 实际上重新运行javascript（所以设置loaded=false实际上会测试为假）
• 要使链接的解决方案真正起作用，loaded需要在页面加载时设置为 true，这会破坏 Chrome！

苹果浏览器

• 触发onpopstate真实和虚拟事件_
• 似乎不会在事件之前重新运行 javascript（loaded如果之前设置为 true，则为 true！）

希望我只是错过了一些东西......

我正在使用 jquery 开发客户端应用程序，并希望保存在 appli 中访问的所有页面以返回给它们。

我为此使用历史 API。

如何显示所有访问过的 URL？

谢谢

在以下函数中，url 返回当前URL。我正在寻找的是，在该函数中，获取以前的 URL，例如，如果我打开/cars/ferrari并转到/cars/ford，url将返回cars/ford，但我想获取/cars/ferrari。

如何获取statechange事件中的上一个 URL？

在阅读https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history并玩弄 history.api 之后，我想知道如何在

我知道 stateObj 是一个 js 对象，所以是这样的：

但是我必须如何使用它？什么方法让我有可能在以后检索这个对象。

我也知道现在不使用标题，我必须使用自己的 javascript 方法来更改页面的标题。我对吗？

我在页面上有一个对象，表示我需要使用要添加以下功能dataTable的 url 跟踪的版本列表/releases

1. 如果/releases?query=<query>，dataTable将使用提供的查询进行初始化
2. query如果用户更改搜索词，则更新参数
3. 浏览器中的后退和前进按钮转到相应的查询

到目前为止，我可以做前 2 个，但是当我监听popstate事件时，重绘表格会触发pushState我不知道如何防止的事件。到目前为止，这是我的代码：

请注意，我使用的是rails后端，这是页面中提供的内联 javascript。

我正在为一家希望获得与http://qz.com/类似的无限滚动效果的初创公司创建一个新博客

它还需要包括在前面提到的链接中看到的 URL 更改。

对于我的生活，我无法弄清楚它是如何完成的，我认为它使用 HTML5 History API，但我也让它在 Internet Explorer 中工作，所以也许它没有？

如果有人能给我一些关于如何完成这项工作的指示（使用 WordPress），我将非常感激。

我目前在 HTTP 发布表单和历史推送状态方面遇到了一点问题。

当我的用户提交 POST 表单，example.com/page-1然后单击此页面中的链接时，他们会被重定向到example.com/page-2history.pushstate。JS 脚本只是更改当前 url，将旧的推送到历史记录，然后显示新的内容。这对我来说非常好。

问题：一旦用户开机example.com/page-2并手动刷新页面（ctrl+r或刷新按钮），Chromes会提示用户再次提交表单；但是表格实际上已经example.com/page-1存在，没有理由在这个“新”页面中再次询问它。

有没有办法在popstate更改时清除javascript中所有先前提交的数据，以防止浏览器重新发布提示？还是我在历史状态中遗漏了什么？还是浏览器目前还没有很好地实现它？

我只用 chrome 测试了它，因为我没有用其他浏览器实现 pushstate。