<!DOCTYPE=html>
<html>
<head>
<script type="text/javascript" src="1/js/jquery-2.1.0.min.js" ></script>
</head>
<body>
<div>下拉加载更多</div>
<ul class="main" style="height:700px;overflow:auto;">
<li class="child" style='border:1px solid red;margin-top:20px;color:grey;height:800px' ><li>
</ul>
</body>
<script type="text/javascript">
$(document).ready(function(){
$(".main").unbind("scroll").bind("scroll", function(e){
var sum = this.scrollHeight;
console.log(sum)
if (sum <= $(this).scrollTop() + $(this).height()) {
$(".main").append(' <li class="child" style="border:1px solid red;margin-top:20px;color:grey;height:800px" ></li> ');
}
console.log($(this).scrollTop() + $(this).height())
});
});
</script>
</html>