内容未在滚动中加载

Question

所以我创建了一个在 jsfiddle 中工作的动态滚动 --> http://jsfiddle.net/9zXL5/39/

var movelist = document.getElementById('movelist');

function yHandler() {
    var contentHeight = movelist.scrollHeight;
    var yOffset = movelist.clientHeight;
    var y = yOffset + movelist.scrollTop;
    if (y >= contentHeight) {
        movelist.innerHTML += '<div class ="newData">yooooo</div>';
    }
}


movelist.onscroll = yHandler;​

但它有未捕获的错误，例如未定义 yHandler。所以我通过放置 var movielist=.. 和 movielist.onscroll = yHandler; 来修复错误。在我的 $(document).ready 里面。错误消失了，但是当我的滚动条到达底部时，内容不会加载，如图所示 --> http://jsfiddle.net/9zXL5/40/

$(document).ready(function() {
    var movelist = document.getElementById('movelist');

    movelist.onscroll = yHandler;
});

function  yHandler (){

        var contentHeight = movelist.scrollHeight;

        var yOffset = movelist.clientHeight;

        var y = yOffset + movelist.scrollTop;

        if(y >= contentHeight){

            movelist.innerHTML += '<div class ="newData">hey look at me</div>';

        });
    }
}

我不知道为什么。如果有人向我解释为什么会这样，我将不胜感激。

Answer 1

你的小提琴有几个错误：

1. 你没有加载 jQuery
2. 您有几个语法错误

这是一个有效的小提琴：http://jsfiddle.net/9zXL5/42/

如果您使用控制台（chrome/devtools 或 FF/firebug）来发现错误并纠正它们，这会有所帮助。在您的情况下，您在这里有右括号和方括号：

        movelist.innerHTML += '<div class ="newData">hey look at me</div>';
    }); // <-- remove the );
} // <-- remove this line

Answer 2

您在该 jsFiddle 中有许多 JavaScript 语法错误，原因是：

1. 没有加载 jQuery，
2. 在函数声明之后有一个不必要的括号和分号 ();)，并且在该函数声明之后还有一个额外的、不匹配的右花括号 (})。

如果您还没有安装，我强烈建议您安装或开始使用 JavaScript 调试器。如果您使用 Firefox，我个人建议使用 Firebug。在 Internet Explorer 和 Chrome 中，可以使用 F12 键访问内置的开发人员工具。

这是updated jsFiddle。