js项目中常用代码笔记

吸顶条

$(window).on("scroll", function () {
var oHeight = $(".fill-box").offset().top;
var dTop = $(window).scrollTop();
if (dTop >= oHeight) {
//吸顶
} else {
//不吸顶
}
});

H5移动端页面分页(滑动到底部，自动加载)

$(document).ready(function(){
//使用了模板渲染数据
var showData = function(data){
var html = template("moduleA",data);
$(html).appendTo($("#record-wrapper"));
};
var n = 1;
var bok = true;
var pageNum = 10;
//发送请求
$.ajax({
url:'/webapp/cps/findIncomeDetail.html?pageNo='+n,
dataType:"json",
success:function(res){
if(res.c==100){
n++;
showData(res);
if(res.d.length<pageNum){
return false;
}
//loading消失
scrollFn(function(){
$.ajax({
url:'/webapp/cps/findIncomeDetail.html?pageNo='+n,
dataType:"json",
success:function(res){
if(res.c==100){
if(res.d.length==0){
//给出无数据提示,并且锁住无法继续请求
return false;
}
n++;
showData(res);
//loading消失
bok = true;
}
},
error:function(err){
//loading消失
}
});
});
}
},
error:function(err){
//loading消失
}
});
function scrollFn(ajaxFn){
var oldScrolTop = $(document).scrollTop();
$(window).scroll(function(){
var scrollTop = $(this).scrollTop();
var scrollHeight = $(document).height();
var windowHeight = $(this).height();
if((scrollTop - oldScrolTop)>0){
if(scrollHeight - (scrollTop + windowHeight) <=3 ){
//出现loading
if(bok){
bok = false;
ajaxFn&&ajaxFn();
}
}
}
oldScrolTop = scrollTop;
});
}
});