jQuery Pagination 分页插件-初始化两次请求的问题

来源:互联网 发布:剑灵捏脸数据下载不了 编辑:程序博客网 时间:2024/04/28 17:04
在做项目的时候碰到的一个问题,jquery pegination 两次请求的问题。
项目中检查请求的时候,发现初始化一直是两次请求存在,各种调试,最后解决了两次请求的问题。
 重点原理:在初始化的时候需要总的数目,因此需要一个请求,但是注意,回调函数中一定要加上判断条件,检测如果是第一次初始化的话,就不需要再走index+1的请求,因为酱紫效果没变,但是页面请求是增加了一次的。
核心代码:

var htmls = '<div class="f-box clearfix">\
<div class="f-teacher-img fl"><a href="http://blog.163.com/qyl_anikin/blog/#" target="_blank"><img src="http://blog.163.com/qyl_anikin/blog/{{imgSrc}}" alt="" /></a></div>\
<div class="f-teacher-info fr">\
<div class="f-teacher-tit">\
<a class="f-teacher-a" href="http://blog.163.com/qyl_anikin/blog/#" target="_blank">{{roomname}}</a><i class="{{type}}">老师</i><a href="javascript:void(0)" class="f-btn-clearfocus">取消关注</a>\
</div>\
<p class="f-teacher-txt">{{info}}</p>\
</div>\
</div>';
var type=['','i-tg','i-teacher','i-teacher']; // 老师 投顾
var bFalse = true;
function initAble(nowIndex){
var This = this;
var count;
commonJs.jsonps(Hexun.myFocusTeacher,{currentPage:nowIndex,pagesize:5},function(data){
if( data.resultKey && data.resultKey == 'ok' ){
count = data.data.count;
var List = data.data.favorites;
var ireu = arguments.callee(Number(nowIndex)+1);
$("#myFocus").pagination(Math.ceil(count/5), {
num_display_entries: 5, //主体页数
current_page: 0,
callback: function(index,jq){
if(bFalse){ // 重点,第一次不要发请求。
bFalse =false;
domAction(List);
return;
} // 第二次在发请求

romoteData(index+1);
domAction(List);
},
items_per_page: 1, //每页显示1
prev_text: "前一页",
next_text: "后一页"
})
}
if( data.errorMessage != null ){
Realert(data.errorMessage);
}
})
}

function romoteData(nowIndex){
commonJs.jsonps(Hexun.myFocusTeacher,{currentPage:nowIndex,pagesize:5},function(data){
if( data.resultKey && data.resultKey == 'ok' ){
count = data.data.count;
domAction(data.data.favorites);
}
if( data.errorMessage != null ){
Realert(data.errorMessage);
}
});

}

function domAction(arr){
if( $.type( arr ) != 'array' ) return;
var This = this;
$('#myFocus').siblings().remove();
for( var i=0; i<arr.length; i++ ){
$(htmls.replace('{{imgSrc}}', arr[i].imgUrl)
.replace('{{roomname}}', arr[i].roomName)
.replace('{{type}}',type[arr[i].level])
.replace('{{info}}',arr[i].roomInfo) ).prependTo($('#focus_i'));
}

}


ps: 项目源代码,仔细阅读,便可知道一次请求的实现过程。commonJs.jsonps函数是自己封装的jsonp请求,全可当做ajax请求,这个不是重点,重点是查看请求部分代码。
0 0