我想要的是拥有改变页面一部分的链接,以及它的动态 URL,我可以在其中指定变量,如 #calendar=10_2010tabview=tab2
强>
查看此示例以获取确切示例:
CLICK HERE FOR EXACT DEMO
所以这是我需要的链接格式:
#calendar=10_2010&tabview=tab2
我需要在 calendar
和 tabview
等链接中有变量,这样我就可以在一个页面上更改多个内容而无需重新加载。
或其他格式,例如 http://www.wbhomes.com.au ,这正是我想要的正是,但是第一种格式也不错,但是更漂亮。
http://wbhomes.com.au/#/propertiesforsale/houseandland/quinnsbeach-waterland1
要求
需要从任何地方访问 例如一封邮件,或者如果我只是 写在网址栏中。
链接应该在历史记录中,所以如果我按下后退或前进按钮,则需要访问页面。
页面刷新也需要工作。
一些资源:
例子:
www.facebook.com - 个人资料页面上的侧边栏链接
www.wbhomes.com.au/ - 100% 接近我想要的
一些教程:
请帮帮我!我从来没有找到任何解决方案来做到这一点,但我不想使用 jquery 或任何 API 或任何库,我想要一个工作的 Javascript/AJAX
和 PHP
脚本。
最佳答案
对于您问题中链接的演示,实现该功能实际上非常简单 - 因为它根本不使用任何 AJAX(当您开始将 AJAX 添加到组合中时,它变得更加困难 - 稍后解释)。要实现该功能,您将;升级您的链接以使用哈希,然后绑定(bind)到 hashchange 事件。不幸的是,hashchange 事件不是跨浏览器兼容的,虽然幸运的是有许多“历史/远程插件”可用 - 我们多年来首选的一个已被证明是 jQuery History ,它是开源的,得到了很大的支持并且正在积极开发中:-)。
不过,在向 Facebook 等网站添加 AJAX 功能时,WBHomes和 Balupton.com那么你将开始面临一系列严重的难题! (我知道我是最后两个站点的首席架构师!)。其中一些问题是:
- 如何优雅轻松地升级某些内部链接以使用历史记录和 AJAX 功能,并检测哈希何时发生变化?同时保持其他链接像以前一样工作。
- 如何从“www.yoursite.com/myapp/a/b/c”重定向到“www.yoursite.com/myapp/#/a/b/c”?并且仍然为用户保持流畅的体验,使 3 次必要的重定向尽可能流畅。
- 如何使用 AJAX 提交表单值和数据并更新哈希?如果他们不支持 Javascript,反之亦然。
- 如何检测 AJAX 请求需要页面的哪个特定区域?这样子页面就会显示正确的页面。
- AJAX状态改变时如何改变页面标题?和其他非页面内容。
- 如何在 AJAX 状态加载和更改时执行漂亮的前奏/后奏效果?这样用户就不会被蒙在鼓里。
- 通过 AJAX 登录时如何更新侧边栏登录信息?显然,我们不希望左上角的登录按钮再出现。
- 对于没有启用JS的用户,如何仍然支持网站?这样它可以优雅地降级并且仍然可以被搜索引擎索引。
我所知道的唯一一个试图解决所有提到的极其困难的问题的开源和可靠项目已被证明是 jQuery Ajaxy 。它实际上是对前面提到的 jQuery History 项目的扩展,提供了一个漂亮优雅的高级界面来添加 AJAX 功能来解决幕后的那些难题,因此我们不必担心它们。这也是前面提到的最后几个商业网站使用的选择解决方案。
祝你好运,如果您还有其他问题,请在此答案上发表评论,我会尽快处理 :-)
更新:现在有 HTML5 History API(pushState、popState),它弃用了 HTML4 hashchange
功能。 History.js现在是 jQuery History 的继承者,并为 HTML5 History API 和 optional 提供跨浏览器兼容性。 hashchange
HTML4 浏览器的后备。 jQuery Ajaxy 将为 History.js 升级
关于php - 如何在 URL 中显示 Ajax 请求?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3205900/