<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jQuery实现当拉动滚动条到底部加载数据</title><style type="text/css">*{margin:0;padding:0;}body{font-size:14px;color:#444;font-family:"微软雅黑",Arial;background:#fff;}a{color:#444;text-decoration: none;}a:hover{color:#065BC2;text-decoration: none;}.clear{clear:both;}img{border:none;vertical-align: middle;}ul{list-style: none;}</style></head><body><script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script><script type="text/javascript">$(document).ready(function(e) { var k=document.body.clientWidth; document.body.style.zoom=k/480; var totalheight = 0;function loadData()
{ totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop());if ($(document).height()/k <= totalheight)
{ //加载数据 $("#container").append($(document).scrollTop()+"<br/>"); } }$(window).scroll( function() {
console.log("滚动条到顶部的垂直高度: "+$(document).scrollTop()); console.log("页面的文档高度 ："+$(document).height()); console.log('浏览器的高度：'+$(window).height()); loadData();}); });</script>
</head><body> <div id="container"> dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/>dd<br/> </div></body></html>