制作非JavaScript的＃标签JavaScript链接词

Question

使用以下教程，我希望我的网站使用AJAX加载内容（但也希望能够使用后退按钮等）： http : //www.queness.com/post/328/a-simple- Ajax驱动-网站与- jqueryphp

当然，如果有人禁用了javascript，则该网站也可以正常工作（不使用Ajax）。

但是，当启用JavaScript的用户向未启用JavaScript的用户发送链接时，就会出现问题。 由于禁用了javascript，它将无法正确处理＃标签，而只会转到首页（因此，无法直接将页面从javascript用户链接到非javascript用户）。 有没有一种方法可以解决此问题（最好是php或htacces）。

Answer 1

HTML5为我们提供了无需刷新页面即可更改URL的方法https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history#Adding_and_modifying_history_entries

这意味着您可以在不刷新页面的情况下更新某些内容，但仍为用户提供一个他们可以添加书签或发送给其他人的网址。 只要您在这些位置有页面，或者正在使用mod_rewrite或类似内容捕获它们，这些URL就可以在没有JavaScript的情况下工作。

https://github.com/browserstate/history.js是一个很棒的小插件，如果浏览器支持，它将使用HTML5历史记录，否则（Internet Explorer）它将更改URL的哈希。

Answer 2

基本上，三个步骤：

• 正常编码您的“ a”标签： <a href='about'>About us</a>
• 在您的JavaScript代码中，拦截<a>标记上的所有click事件，然后导航至# + this.href 。 因此，当他们单击上面的URL时，您导航到site.com/#about而不是site.com/about
• 在您的JavaScript代码中，有一个计时器函数，该函数从当前位置读取哈希值并通过ajax加载相应的url（删除了＃）

由于您照常编写html代码，因此非js用户（更重要的是搜索引擎的bot）仍然可以完全访问该网站。

针对这些评论，我可以提出以下建议：

• 通过javascript将您的主页从site.com重定向到site.com/js/
• 单击<a href='about'>时，导航至site.com/js/#about
• 在“ js”页面上，为非js用户提供类似<a id=about href="/about">click here</a>功能

Answer 3

为什么不正常地构建您的应用程序，然后在顶部添加AJAX，而不是反过来又为您自己做更多的工作呢？

问问自己，为什么需要AJAX页面转换？ 您的应用程序实际上需要它们吗，还是仅仅因为您在其他网站（例如Twitter）上看到过它？