如何在jQuery AJAX应用程序中学习启用后退按钮?

我已经查看了所有最流行的问题,包括那些引用最受欢迎的插件,如BBQ和jQuery Address。

但是,我缺少一些东西。 我需要从我在这些项目中看到的任何东西退后一步。 他们假设我显然没有一些基本知识,而且我无法推断出示例中的每行代码实际上在做什么。

我想做四件事:

1)使前进按钮像在非AJAX应用程序中一样工作。
2)使后退按钮像在非AJAX应用程序中一样工作。
3)反映地址栏中的URL,以便为其添加书签。
4)生成深层链接,以便可以抓取AJAX内容。

这就是全部。 其他任何东西都是矫枉过正的。 这是一个Rails 3.0.4应用程序,我的链接都有一个href为“#”。 单击其中一个链接可激活application.js中的一个函数,该函数替换当前页面上div中的html,其中包含从.js.erb文件呈现的部分创建的更多链接。

我有一个工作正常的痕迹路径,但使用后退按钮会在您查看应用程序之前将您带到您正在查看的任何网站。

所以我的一些问题是:

1)我的每个链接都需要一个唯一的href值而不是简单的“#”吗?
2)我应该每次都替换那个div,或者只是隐藏它并创建一个新的div。 如果是这样,每个新div应该有一个新的id吗?
3)由于当前地址栏中的url没有改变,并且这些AJAX请求都是POSTS,我是否必须在Rails中做任何事情以使其响应这些新URL之一,这些URL在访问时总会触发GET请求通过浏览器历史或后退按钮?

这些障碍阻碍了我解决现有问题。 非常感谢您提供的任何帮助!

编辑:

我的应用程序不是基于标签的。 页面加载时并非所有锚点都可用。 以下是用户点击链接时发生的情况:

1)隐藏表单中的字段用所单击的链接的文本值填充。

2)隐藏的表单被序列化并通过POST传递给控制器​​动作。

3)控制器动作确定谁发出请求,确定他们有权访问哪些数据,并使用表单值(现在为params)来检索对象列表。

4)将这些对象传递给.js.erb视图模板,该视图模板又使用传递的值呈现部分。

5)新的链接通过.js.erb模板中的js反弹。

基本上,由于我的数据不是静态的,我需要弄清楚如何使用表单状态AS IT WAS重新生成POST请求,以便真正“返回”。 或者表单状态是否可以以某种方式缓存屏幕?

1)我的每个链接都需要一个唯一的href值而不是简单的“#”吗?

是的,浏览器仅检测URL中的更改。 如果当前url是foo.com/#,并且用户点击了将他带到foo.com/#的链接,那么历史应该如何知道他去了哪里?

所以,你在#之后添加了唯一的文字。 foo.com/#home和foo.com/#about将生成唯一的历史记录条目。 然后,当用户为其中一个书签时,您可以解析URL的后半部分以找出他的位置。

2)隐藏和交换div,还是替换?

如果您每次都没有获取每个div的内容,则可以节省流量开销。 如果内容足够小,请将其全部放在页面中,然后隐藏/显示div。 如果内容很大,则仅在第一次单击时才获取内容。 即我在A上并点击B,你应该隐藏A并发出ajax请求以获取B的内容,然后显示B.然后,如果我点击返回A,你会显示已经存在的A并隐藏B.不需要当你已经拥有它时,另一个服务器请求获得A.

3)由于当前地址栏中的url没有改变,并且这些AJAX请求都是POSTS,我是否必须在Rails中做任何事情以使其响应这些新URL之一,这些URL在访问时总会触发GET请求通过浏览器历史或后退按钮?

每次使用后退按钮时,新URL都不会触发GET请求。 #style的便捷性是#之后的任何内容都不会被发送到服务器。 即如果您访问foo.com/bar.html#home,客户端会向foo.com/bar.html发出GET请求。 然后,如果用户转换到foo.com/bar.html#about,则浏览器不会自行发出其他请求。 #最初用于表示同一页面内的链接(即大文档,您可能希望在其中有一个链接到每章顶部的索引)。

基本上启用ajax应用程序中的后退按钮技巧它会在url中使用哈希方法,例如,如果您在www.myurl.com进行ajax请求时想要显示不同的页面或不同的区域,您将进行操作,将url更改为www.myurl.com#myaction

有关更多信息,有一个屏幕播放由雷米锐利你应该检查出启用后退按钮