Javascript 检测动态页面上的滚动到底部
我打算在一个div中的scroll to bottom上加载额外的内容，但到目前为止还无法使jquery检测滚动到底。我知道这里有很多问题都在问同样的问题。。但没有一个解决方案对我有效。很明显，我一直在做错事，但作为一个新手，我不知道是什么。代码如下：Javascript 检测动态页面上的滚动到底部,javascript,jquery,Javascript,Jquery,我打算在一个div中的scroll to bottom上加载额外的内容，但到目前为止还无法使jquery检测滚动到底。我知道这里有很多问题都在问同样的问题。。但没有一个解决方案对我有效。很明显，我一直在做错事，但作为一个新手，我不知道是什么。代码如下： <html> <head> <script src="jquery-1.10.1.min.js"> </script> <script> $(document).ready(func
<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>
编辑：当div的内容是静态的，即没有通过ajax加载时，代码就可以工作了，如这里所示这段代码对我来说确实有效-我刚刚拉出$window.滚动~~~~~，并将其插入Chrome控制台，一切都正常工作。我还把你发布的所有内容都拿了出来，并将其作为HTML文件打开。似乎按预期工作，但有一个警告：
如果文档不能在窗口中滚动，则永远不会为此调用scroll，我会说剥离$window。将这些内容滚动到一个新函数中，在$document.ready事件期间也调用它。问题是浏览器返回相同的窗口高度和文档高度值，除非html中提到doctype。添加到html解决了这个问题。这就是为什么它在JSFIDLE等中工作，而不是在我的站点上 真奇怪。。因为它在这里不起作用。而且它也不起作用。我明白你关于不可滚动文档的观点。我会为此做点什么。我在FF和Safari中试用过，效果也不错-只在IE中失败。不确定问题出在哪里，然后-抱歉！我发现了问题。。但仍然没有接近解决方案。您可以看到文档高度和窗口高度每次都相同。。即ajax加载之前的情况。我不知道如何获取新值。@如果在这种情况下，滚动到页面底部时加载了更多内容，那么Ledivin提到的警告就无关紧要了。我猜这就是你想让它工作的方式。@ktkaushik Ledivin的意思是，如果我加载某个提要的某些项目，但它没有超过高度，因此没有形成滚动条，那么我将无法向下滚动以从该提要加载较旧的项目。他的观点站得住脚。