Rails & JS：无限滚动

Question

我已经按照 this tutorial 将我的索引页转换为无限滚动。

但结果是我有一些分页按钮而不是无限滚动

所以这是我的代码：

index.html.erb

-

<div id="my-annonces">
     <%= render @annonces %>
</div>
<div id="infinite-scrolling">
     <%= will_paginate %>
</div>

-

AnnoncesController

-

class AnnoncesController < ApplicationController
 def index
  page_paginate = 6
  @annonces = Annonce.paginate(page: params[:page], per_page: page_paginate).order('created_at DESC')
  respond_to do |format|
   format.html
   format.js
  end
end

-

index.js.erb

-

   $('#my-annonces').append('<%= j render @annonces %>');
    <% if @annonces.next_page %>
       $('.pagination').replaceWith('<%= j will_paginate @annonces %>');
    <% else %>
       $(window).off('scroll');
       $('.pagination').remove();
    <% end %>

-

此 js 从未被调用，现在不知道为什么。如果我把它放在它所谓的视图中。但是我不知道 .pagination 是什么...

-

正如他所说，我在 javascripts 目录中创建了一个新文件 pagination.js.coffee。

-

jQuery ->
 if $('#infinite-scrolling').size() > 0
  console.log "AAAAA "
  $(window).on 'scroll', ->
      console.log "BBBBBB "
    more_posts_url = $('.pagination .next_page a').attr('href')
      console.log "CCCCC "
    if more_posts_url && $(window).scrollTop() > $(document).height() - $(window).height() - 60
          console.log "DDDDD "
        $('.pagination').html('<img src="/assets/ajax-loader.gif" alt="Loading..." title="Loading..." />')
        $.getScript more_posts_url
    return
  return

-

但是这个文件也从来没有被调用过。

我在 rails 控制台或 js 控制台中没有任何错误。我注意到在 JS 方面非常有经验，所以我有点多。

有人知道问题出在哪里吗？谢谢！

Answer 1

我的错，

我只是忘了包括我的 pagination.js.coffee... 我太笨了，对不起大家！

没关系，我希望我的 post 能帮助其他人使用无限滚动！

Rails & JS：无限滚动

Rails & JS : Infinite Scrolling

jquery

ruby-on-rails

coffeescript

pagination

infinite-scroll