滚动条触发的内容动态加载效果

<div id="treeDiv" style="overflow:auto;"><ul id='tt'></ul></div>

<script>

$(function(){

      $("#treeDiv").height("95%");
scrollToBottom(loadTreeData);

});

/*

 * 函数功能：滚动到底部时的触发方法
 */
function scrollToBottom(loadFunc){
var nScrollHight = 0, nScrollTop = 0, nDivHight = 0;
$("#treeDiv").scroll(function(){
nScrollHight = $(this)[0].scrollHeight;
nScrollTop = $(this)[0].scrollTop;
nDivHight = $(this).height();
if(nScrollTop + nDivHight >= nScrollHight){
loadFunc();
}
}).attr("page",2);

}

/*

 * 函数功能：要加载的数据，page:当前页，rows每页加载的条数
 */

function loadTreeData(){

var treeDom = $("#treeDiv");
var page = treeDom.attr("page");
$.ajax({
type : "post",
dataType : "json",
url : "./servlet",
data : {
"action" : "load",
"page" : page,
"rows" : 20,
},
success : function(data){
//给<ul>列表赋值。。。。。。

$("#treeDiv").attr("page",++page);
}
});

  

}

</script>

参考博客：http://blog.youkuaiyun.com/zhangking/article/details/6502134