Javascript 实现无限滚动淘汰的正确方法是什么？

我的模型中有一系列文章，它们很好地呈现为HTML。我想在用户滚动到页面末尾时添加一些新文章。我做到了这一点，但在我看来，这是一种真正的黑客行为：我所做的只是添加了jquery事件处理程序

$（窗口）

function ArticlesViewModel() {
    var self                = this;
    this.listOfReports      = ko.observableArray([]);

    this.loadReports = function() {
        $.get('/router.php', {type: 'getReports'}, function(data){
            self.listOfReports(self.listOfReports().concat(data));
        }, 'json');
    };

    this.loadReports();

    $(window).scroll(function() {
        if($(window).scrollTop() == $(document).height() - $(window).height()) {
            self.loadReports();
        }
    })
};

在我的简单原型场景中，它工作得很好，但我认为即使我隐藏了我的模型，也会调用这个滚动条

那么有没有更合适的方法来做同样的行为呢？
因为没有人回答我的问题，但杰伦给了我一个提示，让我看看在哪里，我会尝试用我发现的回答我的问题。因此：

1） 您必须使用滚动事件

查看

<div id="main" data-bind="foreach: items, event: { scroll: scrolled }">
    <div data-bind="text: name"></div>
</div>



视图模型

var viewModel = {
    items: ko.observableArray([]),
    scrolled: function(data, event) {
        var elem = event.target;
        if (elem.scrollTop > (elem.scrollHeight - elem.offsetHeight - 200)) {
            getItems(20);
        }
    },
    maxId: 0,
    pendingRequest: ko.observable(false)
};

function getItems(cnt) {
    if (!viewModel.pendingRequest()) {
        var entries = [];
        for (var i = 0; i < cnt; i++) {
            var id = viewModel.maxId++;
            entries.push({
                id: id,
                name: "Name" + id
            });
        }
        viewModel.pendingRequest(true);
        $.ajax({
            type: 'POST',
            url: '/echo/json/',
            data: {json: ko.toJSON(entries), delay: .1},
            success: function(entries) {
                ko.utils.arrayForEach(entries, function(entry) {
                    viewModel.items.push(entry);
                });
                viewModel.pendingRequest(false);
            },
            error: function() {
                viewModel.pendingRequest(false);
            },
            dataType: 'json'
        });
    }
}
ko.applyBindings(viewModel);
getItems(20);

var viewModel={
项目：ko.observableArray（[]），
滚动：功能（数据、事件）{
var elem=event.target；
如果（elem.scrollTop>（elem.scrollHeight-elem.offsetHeight-200））{
项目（20）；
}
},
maxId:0，
待处理请求：可观察到（错误）
};
函数getItems（cnt）{
如果（！viewModel.pendingRequest（））{
var分录=[]；
对于（变量i=0；i

采用了和类似的方法

还有一个很好的方法。
没有“正确的方法”，在KnockoutJS中实现无限滚动有很多不同的方法，但我建议使用thinkloop的Knockout JS（KO）无限滚动扩展程序，您可以在这里找到：
有趣的问题（尽管可能不太适合SO的问答格式）。我猜你在追求一个“无限滚动”的解决方案，是吗？如果你也看到了一些开源的替代方案，@Jeroen我不明白为什么它不适合这么做，但我想要的是“无限卷轴”。谢谢你告诉我要寻找什么。如果你看看我的答案，你会看到我提到了这个回购协议。你是100%正确的，我只是想指出，“正确的方式”并不存在，有多种方式，我错过了你的链接：）滚动的函数看起来像什么？@jnguy迟到了，但是滚动的函数就在代码中：
滚动的：函数（数据，事件）{var elem=event.target；if（elem.scrollTop>（elem.scrollHeight-elem.offsetHeight-200））{getItems（20）；}