1

我正在使用 JQuery 在我的 rails 应用程序中实现分页,并且遇到了一个问题,当我在浏览器中回击时,rails 有时无法呈现页面内容,而是将原始 Javascript 转储到我的浏览器窗口中。以下是我正在使用的快速浏览:

分页.js:

if (history && history.pushState) {
  $(function () {
    $('.pagination a').live("click", function () {
      $.ajax({url: this.href, dataType: "script", cache: true});
      history.pushState(null, document.title, this.href);
      $("html, body").animate({ scrollTop: 0 }, 300);
      return false;
    });

    $(window).bind("popstate", function() {
      $.ajax({url: location.href, dataType: "script", cache: true});
    });
  });
}

在我看来,index.js.erb:

$("#products").html("<%= escape_javascript(render("products")) %>");

它有时会起作用,但通常在点击后退按钮时,JS 会被转储到我的浏览器窗口中,而不会被评估/渲染。它看起来像这样(在我的浏览器中):

$("#products").html("<table class=\"table table-striped\">\n<thead>\n<tr>\n<th>Products

...ETC。我不确定到底是什么失败了。有任何想法吗?

4

1 回答 1

0

浏览器请求的路径如下所示

  • /产品
  • /products?page=1
  • /products?page=2

根据 /products?page=2 是浏览到“手动”还是通过 ajax,您呈现 js 版本或普通版本。当您点击后退按钮时,您可能只会获得浏览器缓存中的内容,这可能是这两个版本中的任何一个,具体取决于您之前的导航历史记录。

为了使其正常工作,您希望浏览器维护两个不同版本的缓存。一种方法是在发出 ajax 请求时添加一个额外的参数:

$('.pagination a').live("click", function () {
  $.ajax({url: this.href, dataType: "script", cache: true, data: {'ajax_paginate': true});
  ...
});

jquery-pjax 已经这样做了,如果您使用 pjax-rails 插件,神奇的缓存分离参数将自动为您剥离。

在尝试之前,您需要清空浏览器缓存 - 您可能已经在缓存中获得了一堆坏数据。

于 2012-07-08T18:39:26.153 回答