单击链接然后按“返回”按钮后,保持DOM更改

时间:2011-08-14 17:58:23

标签: javascript jquery dom

我正在使用jQuery的appendTo()方法将项目附加到无序列表中。当用户单击另一个链接,然后按“返回”按钮时,附加的项目将消失。有没有办法使用JavaScript来持久化这些更改?

3 个答案:

答案 0 :(得分:3)

当点击BACK时,某些浏览器会缓存之前(最初加载的)页面。如果您可以使用全新重新加载来重新生成页面,则可以使用缓存控制“无存储,无缓存,必须重新验证”来强制执行此操作。

Chrome想要无商店,IE想要重新验证。对于其他浏览器(和w3c),no-cache就足够了。

答案 1 :(得分:2)

一旦您的用户离开您的网页,DOM就会被丢弃。当您的用户点击后退按钮时,他们会从您的服务器(或其缓存)中获取HTML的新副本。

所以,你有两个选择之一:

  1. 正确的方法是将DOM状态保存在cookie(或会话)中,然后在页面加载时检查该cookie是否存在,如果存在,则附加该信息。

  2. 由于您没有提供足够的信息,我不确定您要完成的任务。因此,如果cookie不够好,您可能必须将单击事件附加到链接,而不是仅将它们发送到该链接,您将首先将DOM存储在变量var theDOM = $('html').clone(true);中,并且然后使用AJAX请求加载该链接的HTML。

  3. 您还必须通知浏览器您的历史记录状态已更改。这可以通过HTML5的新History API来实现。在较旧的浏览器中,您可以通过URL的哈希部分执行类似的操作(尽管在IE的旧版本中甚至不起作用)。然后,当用户单击后退按钮时,您将从变量中重新加载该DOM ...

    无论哪种方式,这都太复杂了。你可能正在以错误的方式看待这个问题。你想要完成什么?

答案 2 :(得分:1)

如果您使用iframe没有任何问题,那么您可以使用它来保留以前的数据。在iframe加载事件上写一个js代码,该代码将保留其中的数据并将其附加到所需的元素。这样,当您导航到下一页并按下后退按钮时,iframe将加载,然后加载事件处理程序将完成其工作,