Question

我打算在div中滚动到底部加载额外的内容，但到目前为止还无法使jquery检测滚动到底部。我知道这里有很多问题要求相同......但是没有一个解决方案对我有用。我显然已经做错了什么，但是在这方面的新事物无法弄清楚是什么。这是代码：

<html>
<head>

<script src="jquery-1.10.1.min.js">
</script>

<script>
$(document).ready(function(){
    var n1=0;
    var n2=5;
    var $win = $(window);   
    $("#page").change(function(){
        var str=$(this).val()

        console.log(str);
        if(str.length===0){$("#rssoutput").html("");}
        else
        {$("#rssOutput").load("http://dodomain.uni.me/getrss.php?q="+str+"&n1="+n1+"&n2="+n2);}

    });
    $(window).scroll(function() {
        if (document.documentElement.clientHeight + $(document).scrollTop() >= document.body.offsetHeight )
        { 

            alert("bottom of the page.");
        }


    });

});

</script>


</head>
<body>

<form>
<select id="page">
<option value="">Select an RSS-feed:</option>
<option value="Google">Google News</option>
<option value="cyanide">cyanide and happiness</option>
<option value="oglaf">Oglaf</option>
<option value="xkcd">xkcd</option>
<option value="wired">wired.com</option>
</select>
</form>
<br>
<div id="rssOutput" >RSS-feed will be listed here...</div>
</body>
</html>

我可能提供了比需要更多的代码..但我不确定问题是否在其他地方。 php刚发送生成一些html off rss feed。它在线http://dodomain.uni.me/rss.html

编辑：当div的内容是静态的（即未通过ajax加载）时代码有效，如此处所示http://jsfiddle.net/jkh5P/

Answer 1

这段代码对我有用 - 我刚拿出$（窗口）.scroll（~~~~），然后将它插入Chrome控制台，这对我来说都很合适。我也把你发布的所有内容都打开了，并将其作为HTML文件打开。似乎按预期工作，但有一点需要注意：

如果文档不可滚动（适合窗口），滚动是/将永远不会被调用为此，我会说你将$（window）.scroll（THIS STUFF）剥离成一个新函数，并调用它在您的$（文件）.ready事件期间。

Answer 2

问题是浏览器为窗口高度和文档高度返回相同的值，除非在html中提到了doctype。将<!DOCTYPE html>添加到html解决了问题。这就是为什么它在jsfiddle等工作，而不是在我的网站上。

检测动态页面上的滚动到底部

2 个答案: