Question

我有这个简单的功能来突出显示表中单击的行。我用Kaminari实现了分页，问题是该功能在更改页面时停止工作。我没有收到任何错误，该行没有突出显示。

$(document).ready(function() { $("#table-master tr").click(function() { var selected = $(this).hasClass("highlight"); $("#table-master tr").removeClass("highlight"); if (!selected) $(this).addClass("highlight"); }); });

index.html.erb

该表在此处呈现为部分：

<div class="container-fluid"> <%= render '/shared/form_search', locals: {parts: @parts} %> <div id="data-variant"></div> <%= render partial: '/shared/table', locals: {parts: @parts} %> <%= paginate @parts%>

{{1}}

Answer 1

如果turbolinks处于活动状态，请尝试使用"turbolinks:load"事件。这个事件会在初始页面加载和导航时触发。

document.addEventListener("turbolinks:load", function() {
  $("#table-master tr").click(function() {
    var selected = $(this).hasClass("highlight");
    $("#table-master tr").removeClass("highlight");
    if (!selected) $(this).addClass("highlight");
  });
});

请参阅：Building Your Turbolinks Application

使用Kaminari更改页面时，jquery函数停止工作

1 个答案: