在导轨中无限滚动答案

【问题标题】：Endless scrolling in rails在导轨中无限滚动
【发布时间】：2014-02-03 13:09:46
【问题描述】：

我参考了http://railscasts.com/episodes/114-endless-page?autoplay=true 在我的项目中使用无限滚动。我猜在视频中他提到的一切都是旧的，所以我尝试将其修改为 rails 4。javascript 文件是

                     var currentPage = 1;

                        function checkScroll() {
                             if (nearBottomOfPage()) {
                                  currentPage++;
                                  new Ajax.Request('/shirts/first?page=' + currentPage, {asynchronous:true, evalScripts:true, method:'get'});
                                  } else {
                                  setTimeout("checkScroll()", 250);
                             }
                          }

                        function nearBottomOfPage() {
                           return scrollDistanceFromBottom() < 150;
                        }

                        function scrollDistanceFromBottom(argument) {
                           return pageHeight() - (window.pageYOffset + self.innerHeight);
                        }

                        function pageHeight() {
                           return Math.max(document.body.scrollHeight, document.body.offsetHeight);
                        }

                        document.observe('dom:loaded', checkScroll);

我没有使用 rjs 文件，而是在 .js.erb 中编写了以下代码

                    if @first.total_pages > @first.current_page
                         page.call 'checkScroll'
                    else
                         page['#loading'].hide
                    end

我做事正确吗？当我用萤火虫检查我的浏览器时，它说：

                      TypeError: document.observe is not a function
                      document.observe('dom:loaded', checkScroll);

我的代码有什么问题？有人可以帮我解决这个问题吗？

【问题讨论】：

标签： javascript ruby-on-rails infinite-scroll

【解决方案1】：

我认为 railscast 示例使用 prototype.js 而不是 jQuery，我猜您在 Rails 4 应用程序中使用 jQuery，因为我认为 document.observe 是 method in prototype，而不是 jQuery。

你可能想看看revised episode for endless scrolling，不幸的是它不是免费的，但来自 Railscast 的 Ryan Bates 也在 github 上分享了他的代码，所以你可以看到修改后的剧集的 code on github，它是 Rails 3.1，使用 jQuery，所以可能更容易移植到 Rails 4。

希望这会有所帮助。

【讨论】：