栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

基于bootstrap3和jquery的分页插件

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

基于bootstrap3和jquery的分页插件

自己写的一款基于bootstrap3和jquery的分页插件,初学jquery插件写法,写的很一般。拿出来献丑了。


(function ($) {
 $.fn.mypage = function(options){
  var defaults = {
   now:1,
   max:1,
   callback:null,
   style:null,
   first:"«",
   last:"»"
  }
  var options = $.extend(defaults, options);
  this.each(function(){
   options.max=Math.round(options.max);
   options.now=Math.round(options.now);
   if(options.max<=1||isNaN(options.max)||isNaN(options.now))return;
   options.now=options.now<1?1:options.now>options.max?options.max:options.now;
   var mainbox=$(this).html("");
   var page_box= $("
    ").addClass("pagination").appendTo(mainbox); if(options.style!=null) page_box.addClass(options.style=="big"?"pagination-lg":options.style=="small"?"pagination-sm":options.style) var page_back=$("
  • "+options.first+"
  • ").appendTo(page_box); if(options.now==1) page_back.addClass("disabled"); else page_back.on("click",function(){if(typeof options.callback === "function")options.callback(1);}) var page_next=$("
  • "+options.last+"
  • "); if(options.now==options.max) page_next.addClass("disabled"); else page_next.on("click",function(){if(typeof options.callback === "function")options.callback(options.max);}) var page_now=$("
  • "+options.now+"
  • ").addClass("active"); if(options.max<=10) for(var i=1;i<=options.max;i++) $.mypageInsertItem(i,options.now,page_now,page_box,options.callback); else if(options.now<5){ for(var i=1;i<=6;i++) $.mypageInsertItem(i,options.now,page_now,page_box,options.callback); $.mypageInsertOther(page_box); }else if(options.max-options.now<4){ $.mypageInsertOther(page_box); for(var i=options.max-5;i<=options.max;i++) $.mypageInsertItem(i,options.now,page_now,page_box,options.callback); }else{ $.mypageInsertOther(page_box); for(var i=options.now-2;i<=options.now+2;i++) $.mypageInsertItem(i,options.now,page_now,page_box,options.callback); $.mypageInsertOther(page_box); } page_next.appendTo(page_box); }) }, $.mypageInsertItem=function(i,now,page_now,page_box,fn){ if(i!=now) $("
  • "+i+"
  • ").on("click",function(){if(typeof fn === "function")fn($(this).text());}).appendTo(page_box); else page_now.appendTo(page_box); }, $.mypageInsertOther=function(page_box){ $("
  • ").addClass("disabled").appendTo(page_box); }, $.mypage=function(id,now,max,fn){$("#"+id).mypage({now:now,max:max,callback:fn})}, $.mypagesm=function(id,now,max,fn){$("#"+id).mypage({now:now,max:max,callback:fn,style:"pagination-sm"})}, $.mypagelg=function(id,now,max,fn){$("#"+id).mypage({now:now,max:max,callback:fn,style:"pagination-lg"})} })(jQuery);

    以上所述就是本文的全部内容了,希望对大家学习jQuery能够有所帮助。

    转载请注明:文章转载自 www.mshxw.com
    本文地址:https://www.mshxw.com/it/101379.html
    我们一直用心在做
    关于我们 文章归档 网站地图 联系我们

    版权所有 (c)2021-2022 MSHXW.COM

    ICP备案号:晋ICP备2021003244-6号