js下拉加载更多 

<!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>

　　

posted @ 2018-11-20 17:28  小囧光  阅读(793)  评论(0)    收藏  举报