jquery history.pushState 脚本只在第一次工作答案

【问题标题】：jquery history.pushState script only works the first timejquery history.pushState 脚本只在第一次工作
【发布时间】：2014-12-18 03:04:32
【问题描述】：

我正在尝试使用 ajax 进行分页，使用 pushState 来更新 url。我遇到的问题是它只执行第一次。

我的完整设置如下

Rails 3.2，查询， Kaminari（分页宝石）

这是我用来更新 url 的代码

jQuery ->
  $(".pagination a[data-remote=true]").on 'click', (e) ->
    e.preventDefault()
    history.pushState {}, '', $(this).attr("href")

在show.js.erb上，更新我使用的内容

$("#reviews").html('<%= escape_javascript render("review") %>')
$("#paginator").html('<%= escape_javascript(paginate(@reviews, :remote => true).to_s) %>');

该节目每次都有效，但第一个脚本只是第一次。

如果我在生成的脚本上设置一个断点，我可以看到脚本第一次被调用的时间，它可以工作，但之后它就不会被调用，好像我猜有某种解除绑定。

【问题讨论】：

标签： jquery ruby-on-rails-3.2 pagination coffeescript

【解决方案1】：

使用 jquery-ujs，我就是这样做的：

在 show.html.erb 中：

<div id="content">
  <div class="paginator">
     <%= paginate @mydata, remote: true %>
  </div>

  <div id="mydata">
    <%= render partial: 'mydata' %>
  </div>

  <div class="paginator">
    <%= paginate @mydata, remote: true %>
  </div>
</div>

在 show.js.erb 中：

$('div#mydata').html('<%= j render partial: 'mydata' %>');
$('div.paginator').html('<%= j(paginate(@mydata, :remote => true).to_s) %>');

在 application.js 中：

$('div#content').on('click', '.pagination a[data-remote=true]', function() {
    history.pushState(null, '', $(this).attr("href"))
});
$(window).on('popstate', function () {
    var remoteUrl = "<a href='" + document.location.href + "'" + " data-remote='true'></a>"
    $.rails.handleRemote( $(remoteUrl) );
});

【讨论】：

【解决方案2】：

试试：

history.pushState 'data', '', $(this).attr("href")

【讨论】：

【解决方案3】：

可能所有.pagination a[data-remote=true] 链接都在#paginator 容器中，其内容在show.js.erb 中更新。您需要在 html 替换后重复使用 on 方法绑定，或者只需从父容器 [read on documentation for details] 中延迟事件处理程序@

jQuery ->
  $("#paginator").on 'click', '.pagination a[data-remote=true]', (e) ->
    e.preventDefault()
    history.pushState {}, '', $(this).attr("href")

【讨论】：