pushState with Rails ajax

我有一个索引操作页面,显示了与Kaminari一起分页的项目列表,我已经为他们添加了ajaxfunction,现在我试图通过使用pushState来获取适合的URL。

我的问题是当我的分页链接通过以下方式完成时,如何将URL传递给pushState方法:

 

和javascript视图如下:

 $('.grid').html(''); $('.pagination').html(''); 

我需要以某种方式获取URL作为我读过的pushstate的第三个参数传递?

更新:

我已将其更改为以下内容:

 $(document).ready(function() { $(document).on('click', '.pagination a[data-remote=true]', function(e) { history.pushState({}, '', $(this).attr('href')); }); $(window).on('popstate', function () { $('.grid').html(''); $('.pagination').html(''); }); }); $('.grid').html(''); $('.pagination').html(''); 

所以我认为我的代码现在通过捕获我自己的分页远程真实链接上的点击来绕过rails jQuery UJS,并且URL有点工作。

似乎URL有时会更新。 后退按钮也失败了。

我出错的任何想法?

更新2:

我将一大堆javascript移动到我的主页javascript而不是javascript视图:

  $(document).on('click', '.pagination a[data-remote=true]', function(e) { history.pushState(null, '', $(this).attr('href')); }); $(window).on('popstate', function () { console.log('popState started'); $('.grid').html(''); $('.pagination').html(''); }); 

删除了popstate的东西,上面的代码更新了链接点击时的URL,但是当我在页面刷新测试时我的网格区域被替换为文本输出以下行儿子我的页面:

 $('.grid').html(''); $('.pagination').html('<%= escape_javascript(paginate(@coasters, remote: true).to_s) 

如何让popstate正常工作?

我处于类似的情况,这就是我解决它的方式。 我不确定这是否适用于Kaminari因为我不知道kaminari如何工作。

 #index.html.erb 
<%= render(@coasters) %>

 #index.js.erb $('.grid').html('<%= escape_javascript render(@coasters) %>'); $('.pagination').html('<%= escape_javascript(paginate(@coasters, remote: true).to_s) %>'); 

在分页时,由于启用了data-remote ,它们将仅渲染index.js.erb

在我的JavaScript中

  $(document).on('click', '.pagination a[data-remote=true]', function(e) { history.pushState({}, '', $(this).attr('href')); }); $(window).on('popstate', function () { $.get(document.location.href) }); 

在单击分页链接时,data-remote将处理ajax请求并呈现index.js.erb

但是在单击浏览器的后退按钮时,将触发popstate事件,并且浏览器中的当前URL 将从历史记录链接 。 因此,我们使用$.get(document.location.href)使用该URL触发另一个ajax请求。 这与点击前一个分页具有相同的效果。