无休止的滚动不起作用答案

【问题标题】：endless scrolling does not work无休止的滚动不起作用
【发布时间】：2013-08-27 17:32:32
【问题描述】：

更新：我的 Github 存储库https://github.com/Marc585/smartforce2

我刚刚完成了 onemonthrails 教程。在最后一章，它是关于无限滚动的。我三次检查了我的代码，但它不起作用。我没有收到错误或任何东西。它只是没有做任何事情。我正在构建一个 pinterest 克隆，在我滚动到底部后，它应该会加载下一页的图钉。

这是我的 pin.js.coffee

# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/

jQuery ->
    $('#pins').imagesLoaded ->
        $('#pins').masonry itemSelector: ".box"

    if $('.pagination').length
        $(window).scroll ->
            url = $('.pagination .next_page a').attr('href')
            if url && $(window).scrollTop() > $(document).height() - $(window).height() - 50
                # What to do at the bottom of the page
                $('.pagination').text("Fetching more pins...")
                $.getScript(url)
            $(window).scroll()

这是我的 index.js.erb

$boxes = $('<%= j render(@pins) %>')

$('#pins').append( $boxes ).imagesLoaded( function(){
    $('#pins').masonry( 'reload');
});
<% if @pins.next_page %>
    $('.pagination').replaceWith('<%= j will_paginate(@pins) %>');
<% else %>
    $('.pagination').remove();
<% end %>

这是我的引脚控制器：

class PinsController < ApplicationController
  before_filter :authenticate_user!, except: [:index]

  # GET /pins
  # GET /pins.json
  def index
    @pins = Pin.order("created_at desc").page(params[:page]).per_page(20)

    respond_to do |format|
      format.html # index.html.erb
      format.json { render json: @pins }
      format.js
    end
  end

  # GET /pins/1
  # GET /pins/1.json
  def show
    @pin = Pin.find(params[:id])

    respond_to do |format|
      format.html # show.html.erb
      format.json { render json: @pin }
    end
  end

  # GET /pins/new
  # GET /pins/new.json
  def new
    @pin = current_user.pins.new

    respond_to do |format|
      format.html # new.html.erb
      format.json { render json: @pin }
    end
  end

  # GET /pins/1/edit
  def edit
    @pin = current_user.pins.find(params[:id])
  end

  # POST /pins
  # POST /pins.json
  def create
    @pin = current_user.pins.new(params[:pin])

    respond_to do |format|
      if @pin.save
        format.html { redirect_to @pin, notice: 'Pin was successfully created.' }
        format.json { render json: @pin, status: :created, location: @pin }
      else
        format.html { render action: "new" }
        format.json { render json: @pin.errors, status: :unprocessable_entity }
      end
    end
  end

  # PUT /pins/1
  # PUT /pins/1.json
  def update
    @pin = current_user.pins.find(params[:id])

    respond_to do |format|
      if @pin.update_attributes(params[:pin])
        format.html { redirect_to @pin, notice: 'Pin was successfully updated.' }
        format.json { head :no_content }
      else
        format.html { render action: "edit" }
        format.json { render json: @pin.errors, status: :unprocessable_entity }
      end
    end
  end

  # DELETE /pins/1
  # DELETE /pins/1.json
  def destroy
    @pin = current_user.pins.find(params[:id])
    @pin.destroy

    respond_to do |format|
      format.html { redirect_to pins_url }
      format.json { head :no_content }
    end
  end
end

来自我的开发人员工具的错误消息 https://www.dropbox.com/s/odqknmw7np1f4cv/Bildschirmfoto%202013-08-31%20um%2014.34.40.png

【问题讨论】：

您的scroll 回调是否被调用？ url 是您所期望的吗？你检查过if 中的其他值吗？
@muistooshort 不幸的是我不知道你刚才说的是什么意思。我是 ROR 初学者。我刚刚添加了我的 github 存储库。如果你能看看那将是真棒。谢谢
嗯，是时候学习一点调试了。尝试向 CoffeeScript 添加一些 console.log 调用，看看你的回调是否被调用。并检查您浏览器的开发者工具中的请求，以了解服务器和浏览器之间的对话。
我很想学习如何调试。我用谷歌搜索了很多，但找不到一个好的教程或类似的东西，关于在哪里设置我的代码和从哪里获取日志文件。我在浏览器开发工具的帖子中附上了屏幕截图，但我不知道如何处理错误消息。其他有关该错误的堆栈溢出帖子对我没有帮助。
您需要在您的页面上包含 ImagesLoaded (desandro.github.io/imagesloaded) 插件吗？您正在调用一个不存在的 imagesLoaded 方法。

标签： javascript ruby-on-rails coffeescript scroll

【解决方案1】：

你不见了

format.js 在 pin_controller.rb 中的显示操作中。这是来自一个月的 Rails 笔记

注意：您必须创建一个类似的 show.js.erb 并将 format.js 选项添加到您的 users#show 操作，以便在用户的个人资料页面上进行无休止的滚动

def show
@pin = Pin.find(params[:id])
 respond_to do |format|
  format.html # show.html.erb
  format.json { render json: @pin }
  format.js
 end
end

你的 show.js.erb 应该是这样的

boxes = $('<%= j render(@pins) %>')

$('#pins').append( $boxes ).imagesLoaded( function(){
   $('#pins').masonry( 'reload');
});
<% if @pins.next_page %>
   $('.pagination').replaceWith('<%= j will_paginate(@pins) %>');
<% else %>
   $('.pagination').remove();
<% end %>

【讨论】：