jQuery pager.js 插件动态分页功能实例分析
本文实例讲述了jQuerypager.js插件动态分页功能。分享给大家供大家参考,具体如下:
pager.js代码
functionPage(opt){ varset=$.extend({num:null,startnum:1,elem:null,callback:null},opt||{}); if(set.startnum>set.num||set.startnum<1){ set.startnum=1; } varn=0,htm=''; varclickpages={ elem:set.elem, num:set.num, callback:set.callback, init:function(){ this.elem.next('div.pageJump').children('.button').unbind('click') this.JumpPages(); this.elem.children('li').click(function(){ vartxt=$(this).children('a').text(); varpage='',ele=null; varpage1=parseInt(clickpages.elem.children('li.active').attr('page')); if(isNaN(parseInt(txt))){ switch(txt){ case'下一页': if(page1==clickpages.num){ return; } if(page1>=(clickpages.num-2)||clickpages.num<=6||page1<3){ ele=clickpages.elem.children('li.active').next(); }else{ clickpages.newPages('next',page1+1); ele=clickpages.elem.children('li.active'); } break; case'上一页': if(page1=='1'){ return; } if(page1>=(clickpages.num-1)||page1<=3||clickpages.num<=6){ ele=clickpages.elem.children('li.active').prev(); }else{ clickpages.newPages('prev',page1-1); ele=clickpages.elem.children('li.active'); } break; case'首页': if(page1=='1'){ return; } if(clickpages.num>6){ clickpages.newPages('首页',1); } ele=clickpages.elem.children('li[page=1]'); break; case'尾页': if(page1==clickpages.num){ return; } if(clickpages.num>6){ clickpages.newPages('尾页',clickpages.num); } ele=clickpages.elem.children('li[page='+clickpages.num+']'); break; case'...': return; } }else{ //if((parseInt(txt)>=(clickpages.num-3)||parseInt(txt)<=3)&&clickpages.num>6){ //clickpages.newPages('jump',parseInt(txt)); //} //ele=$(this); //} //page=clickpages.actPages(ele); //if(page!=''&&page!=page1){ //if(clickpages.callback){ //clickpages.callback(parseInt(page)); //} vari=parseInt(txt); if(isNaN(i)||(i<=0)||i>clickpages.num){ return; }elseif(clickpages.num>6){ clickpages.newPages('jump',i); }else{ varele=clickpages.elem.children('li[page='+i+']'); clickpages.actPages(ele); if(clickpages.callback){ clickpages.callback(i); } return; } if(clickpages.callback){ clickpages.callback(i); } } }); }, //active actPages:function(ele){ ele.addClass('active').siblings().removeClass('active'); returnclickpages.elem.children('li.active').text(); }, JumpPages:function(){ this.elem.next('div.pageJump').children('.button').click(function(){ vari=parseInt($(this).siblings('input').val()); if(isNaN(i)||(i<=0)||i>clickpages.num){ return; }elseif(clickpages.num>6){ clickpages.newPages('jump',i); }else{ varele=clickpages.elem.children('li[page='+i+']'); clickpages.actPages(ele); if(clickpages.callback){ clickpages.callback(i); } return; } if(clickpages.callback){ clickpages.callback(i); } }) }, //newpages newPages:function(type,i){ varhtml="",htmlLeft="",htmlRight="",htmlC=""; varHL='
上面是pager.js部分
html部分
前往 页 GO
更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery扩展技巧总结》、《jQuery常用插件及用法总结》、《jQuery切换特效与技巧总结》、《jQuery遍历算法与技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:czq8825#qq.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。