Question

我正在尝试使用Rails应用程序中的可点击行。我使用Bootstrap 4.1.3创建表。

Rails版本：5.2.1

<tbody>
    <% @animals.each do |animal| %>
      <tr data-link="<%= animal_path(animal) %>">
        <td><%= image_tag(animal.image.url(:small)) %></td>
        <td><%= animal.name %></td>
        <td><%= animal.birthdate %></td>
      </tr>
    <% end %>
  </tbody>

这是我的animal.js文件

$(document).ready(function() {
    $("tr[data-link]").click(function(event){
        console.log("click")
        window.location.href = $(this).data("link")
        event.preventDefault();
   });
})

但是我有一个问题。第一次打开页面时，一切正常。但是，如果我使用导航栏更改页面，则会收到此错误。我的可点击代码不起作用。我没有在任何地方打电话给text.replace。这个错误是 prevel.js ，我没有使用任何prevel.js

error_photo

Error in event handler for (unknown): TypeError: text.replace is not a function

当我再次重新加载页面时，一切正常。

我没有找到解决方案。有什么问题吗？

Answer 1

您是否正在使用turbolinks gem？如果是这样，请将您的脚本更改为：

document.addEventListener('turbolinks:load', function() {
  $(document).ready(function() {
    $("tr[data-link]").click(function(event){
        console.log("click")
        window.location.href = $(this).data("link")
        event.preventDefault();
    });
  });
})

或者如果您不想要的话，禁用涡轮链接。

Rails引导可点击行不起作用

1 个答案: