Question

我正在尝试为我的页面实现无限页面设置。我已经在两天内尝试了很多不同的方法，但似乎无法让它发挥作用。我喜欢这个博客文章中的建议设置，但我似乎无法让它工作：http://pedromtavares.wordpress.com/2011/05/08/endless-page-scrolling-with-rails-3-and-jquery/

我也试过Ryan Bates的截屏视频，但没有设法实现它......

我尝试了以下内容：

已安装的插件

rails plugin install git://github.com/pedromtavares/endless_scroll_example.git

修改我的控制器主页：

def index

last = params[:last].blank? ? Time.now + 1.second : Time.parse(params[:last])
@feeds = Feed.input(last)

end

使用新方法'input'修改我的“Feed-model”：

def self.input(last)
   self.where("created_at < ? ", last).order('created_at desc').limit(5)
end

修改了我的索引

<% content_for :scripts do %>
  <%= javascript_include_tag 'endless' %>
<% end %>


<%unless @feeds.blank?%>
<ul class='list' last="<%=@feeds.to_a.last.created_at%>">
<%= render :partial => 'feeds', :collection => @feeds%>

<div id='infinite-scroll'></div>
</ul>
<%end%>

我的部分_feeds.html.erb看起来像这样（只填写文字:)：

<%=feeds.title%>
jfjh
</p>
<p>
    jfjh
    </p>
    <p>
        jfjh
        </p>
        <p>
            jfjh
            </p>
            <p>
                jfjh
                </p>

                 <br>
<hr>

添加了我的新javascript（endless.js）礼貌pedromtavares

$('ul').endlessScroll({
  fireOnce: true,
  fireDelay: 500,
    ceaseFire: function(){
      return $('#infinite-scroll').length ? false : true;
    },
    callback: function(){
      $.ajax({
          url: '/home',
          data: {
              last: $(this).attr('last')
          },
          dataType: 'script'
        });
    }
});

我的最终javascript文件如下所示：

<% unless @feeds.blank? %>
    $('.endless_scroll_inner_wrap').append("<%=escape_javascript(render :partial => 'feeds', :collection => @feeds)%>");
    $('ul').attr('last', '<%=@feeds.to_a.last.created_at%>')
<% else %>
    $('#infinite-scroll').detach();
<% end %>

我没有任何错误，但也没有无限滚动。我从阵列中得到了第一个帖子，但没有得到其余的帖子。无法弄清楚我做错了什么，感觉我现在已经尝试了一切......请帮忙！

Answer 1

我自己也遇到过类似的问题。我的问题是我在我的javascript中的追加找不到合适的div。可能适合你 -

在您的javascript文件中，更改：

    $('.endless_scroll_inner_wrap').append...

到：

    $('#infinite-scroll').append...

并查看是否修复了它。

又一个无尽的页面困境

1 个答案: