javascript - 使用 kaminari Rails 无限滚动时未捕获错误，为什么？简单的

Question

我对 JS 很陌生，所以我不知道问题的根源是什么，但我遇到了一个我认为相对简单的问题。我正在尝试实现像 this demo here 这样的无限滚动功能。我相信我已经完全按照规定实现了它，但我在 Chrome 控制台中遇到了以下错误。

'Uncaught Type Error: undefined is not a function'

我认为这就是阻止无限滚动工作的原因。它似乎发生在第 3 行。

这是 CoffeeScript

$(document).ready ->
  $("#entries .pages").infinitescroll
    navSelector: "nav.pagination" 
    nextSelector: "nav.pagination a[rel=next]" 
    itemSelector: "#entries tr.photo"

拒绝.js.erb

$("#entries").append("<tbody class='page'><%= escape_javascript(render(entries)) %></tbody>");

拒绝.html.erb

<h1>Rejected</h1>
<table id="entries">
  <thead>
    <tr>
      <th>Name</th>
      <th>Email</th>
      <th>Photo</th>
      <th>Submitted</th>
      <th colspan="3"></th>
    </tr>
  </thead>
  <tbody class="page">
  <%= render partial: 'admin/entries/entries' %>

  </tbody>
</table>
<%= paginate entries %>

和部分_entries.html>erb

<% if entries.any? %>
  <% entries.each do |photo| %>
    <tr id='photo_<%= photo.id %>' class='photo'>
      <td><%= photo.firstname %></td>
      <td><%= photo.email %></td>
      <td><%= image_tag photo.attachment.url %></td>
      <td><%= time_helper(photo.created_at) %></td>
      <% if photo.workflow_state == 'rejected' %>
      <td><%= link_to "Approve", (toggle_approve_field_admin_entry_path(photo, params.except(:controller, :action))), :remote => true %></td>
      <td><%= link_to 'Destroy', admin_entry_path(photo), method: :delete, data: { confirm: 'Are you sure?' }, :remote => true %></td>
      <% elsif photo.workflow_state == 'approved' %>
      <td><%= link_to "Reject", (toggle_reject_field_admin_entry_path(photo, params.except(:controller, :action))), :remote => true %></td>
      <% else %>
      <td><%= link_to "Approve", (toggle_approve_field_admin_entry_path(photo, params.except(:controller, :action))), :remote => true %></td>
      <td><%= link_to "Reject", (toggle_reject_field_admin_entry_path(photo, params.except(:controller, :action))), :remote => true %></td>
      <% end %>
    </tr>
  <% end %>
<% end %>

有人知道为什么这不起作用吗？

更新:现在我没有错误了。我认为现在的问题是选择器:

这在局部，要求更多的东西

<tr id='photo_<%= photo.id %>' class='photo'>

与此匹配器不匹配

itemSelector: "#entries tr.photo"

但是因为 id 是动态的，如何将其放入夹具？

Answer 1

“未定义不是函数”意味着您试图调用不存在的东西。我的赌注是那个infinitescroll 函数；如果您还没有包含 infinite scroll plugin在你的项目中(或者没有正确加载它)，那么它将是未定义的，你会得到上面的错误。确保您已将该文件包含在正确的位置，并从浏览器控制台检查资源管道是否已将其包含在您的页面中。