window.height和document.height返回相同的值
window.height and document.height returning the same value
在下面的代码中,我试图实现无限滚动。我遇到的问题是"document.height"answers"window.heith"返回的值相同。有人能帮我哪里出错吗?
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
$(window).scroll(function(){
if($(window).scrollTop() == $(document).height() - $(window).height()){
$('div#loadmoreajaxloader').show();
$.ajax({
url: "loadmore.php",
success: function(html){
if(html){
$("#postswrapper").append(html);
$('div#loadmoreajaxloader').hide();
console.log($(document).height());
console.log($(window).height());
}else{
$('div#loadmoreajaxloader').html('<center>No more posts to show.</center>');
}
}
});
}
});
</script>
<style>
body{ margin:0px; }
#wrapper{
width:600px;
margin:auto;
}
.spacer{
clear:both;
height:5px;
}
.txtarea{
font-size:18px;
height:50px;
width:100%;
}
#postswrapper{
border-bottom:1px dotted #555555;
}
.item{
border-top:1px dotted #555555;
padding:10px 5px;
font-size: 16px;
}
.item:hover{
background:#EFEFEF;
}
#newpostlink{
display:block;text-align:center;border:2px solid #414141;background:#7D7D7D;color:#fff; margin: 0 0 10px;padding:5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;font-size:20px;text-decoration:none;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="postswrapper">
<p style="font-size:28px">Infinite Scroll Demo 2</p>
<div class="item">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div class="item">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div class="item">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div class="item">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<div id="loadmoreajaxloader" style="display:none;"><center><img src="ajax-loader.gif" /></center></div>
</div>
<div id="footer" style="display:inline-block;width:100%;padding:10px;background-color:#FFFFFF">
</div>
</body>
</html>
也许。。。
if ($(window).scrollTop() <= $(document).height() - $(window).height()) {
相关文章:
- 节点导出返回一个空对象
- ES6构造函数返回基类的实例
- 在刚刚调用的append函数之后,jquery.height()不会返回实际值
- $(document).height和$(window).heaght都返回相同的值-使用的是正确的doctype
- document和window height返回相同的值
- .height() 以百分比返回高度,如何以像素为单位获取它
- $(window).height() 返回奇怪的值
- $.height 在颜色框中返回 0
- window.height和document.height返回相同的值
- 为什么jquery height和javascript height返回0
- 函数,参数为image, width, height,并返回一个调整大小的base64图像数据
- Div height并不总是返回相同的数字
- Jquery $(window).height()和$(document).height()返回相同的结果
- $('').css('height')在JQuery中返回计算的高度,而不是css高度
- 使用anguarJS内部指令height返回0
- 元素.height返回可见高度-我想要total
- $(window).height()返回文档高度(但声明了doctype)
- $.height 在第一次加载页面时返回 0
- jQuery .height()没有返回正确的值
- Jquery height()方法返回行高