Ajax网址导航

时间:2011-06-08 19:04:35

标签: javascript jquery

我正在尝试制作类似于GitHub的内容,根据网址加载内容。

我看到了这个article,但我不想使用插件。我想手动编写代码。

我看到一篇文章here,他们不断检查document.location.hash是否有任何更改,然后加载内容。有没有更好的方法来实现这一目标?

以下是我的想法:

  1. 在页面加载时加载内容。
  2. 在网址上加载内容更改。
  3. 从锚标记更改网址而不重新加载网页。
  4. SEO。
  5. 后退按钮。

3 个答案:

答案 0 :(得分:3)

某些浏览器支持hashchange事件和window.onhashchange事件处理程序:

  

当窗口的哈希值发生变化时,会触发hashchange事件(请参阅location.hash)。

但有些人没有,计时器黑客用于没有hashchange事件的浏览器。

你最好的办法是抓住一个现有的插件或库并弄清楚它是如何工作的,这可以帮助你克服各种浏览器黑客和特殊情况:

答案 1 :(得分:1)

如果你想要一些SEO的相似性,你仍然需要真正的链接,然后用一些使用https://github.com/browserstate/History.js这个的javascript替换点击事件。然后,您只需设置事件,以便在历史记录触发器上通过AJAX进行操作。

我链接的History.js脚本使用新浏览器中引入的新历史记录api,但如果不支持则会回退。

在页面重新加载/首页加载时,您可能希望从服务器提供第一个内容 - 因此Google有一些实际内容要缓存。

答案 2 :(得分:0)

我在“codeigniter”类似问题上发现了这个问题,但应该回答你的问题。

CodeIgniter + jQuery(ajax) + HTML5 pushstate: How can I make a clean navigation with real URLs?

这是一个非常轻松的解决方案: https://github.com/cairo140/html5-history-example

点击此处查看演示: http://cairo140.github.io/html5-history-example/one.html

希望它可以提供帮助