写了一个可以到处适用的bootstarp样式的分页控件

先上效果图：  并且可以在同一个页面使用两个分页控件去发起不同的请求；  代码如下，以供大家共同学习： (function($) { var SplitPageDiv = function(ele, opt) { this.$element = ele,    this.defaults = { url : '', data : {}, onLoadSuccess : $.noop, rows : 10, total : 0    },    this.options = $.extend({}, this.defaults, opt),    this.options.data.rows = this.options.rows,    this.options.current = this.options.current || 1,    this.options.data.page = this.options.current };   SplitPageDiv.prototype = { initGrid : function() { var __this = this; var ajax = null; if(ajax) {                    ajax.abort();               }                ajax = $.ajax({ type : "POST", dataType : "JSON", url : this.options.url, data : this.options.data, success : function(result) { if (result) { if (result.done) { __this.options.total = result.data.context.total; __this.options.pageCount = __this.options.total % __this.options.data.rows == 0  ? __this.Div(__this.options.total, __this.options.data.rows)  : __this.Div(__this.options.total, __this.options.data.rows) + 1; __this.options.onLoadSuccess(result.data, __this.options.current); __this.render(__this.$element, __this.options); __this.event(__this.$element, __this.options); } else { $.messager.alert('错误', result.msg, 'error'); } } else { $.messager.alert('错误', '网络异常，请稍后再试！', 'error'); } }, error : function(err) { $.messager.alert('操作提示', '获取信息失败，请联系管理员!', 'error'); } }); }, render : function(obj, args) { return (function(){ obj.empty(); if(args.current > 1){ obj.append('<li class="prev"><a href="javascript:;">前一页</a></li>'); }else{ obj.append('<li class="prev disabled"><a href="javascript:;">前一页</a></li>'); } if(args.current != 1 && args.current >= 4 && args.pageCount != 4){ obj.append('<li><a href="javascript:;" class="tcdNumber">' + 1 + '</a></li>'); } if(args.current-2 > 2 && args.current <= args.pageCount && args.pageCount > 5){ obj.append('<li><a href="javascript:;">...</a></li>'); } var start = args.current -2,end = args.current+2; if((start > 1 && args.current < 4)||args.current == 1){ end++; } if(args.current > args.pageCount-4 && args.current >= args.pageCount){ start--; } for (;start <= end; start++) { if(start <= args.pageCount && start >= 1){ if(start != args.current){ obj.append('<li><a href="javascript:;" class="tcdNumber">'+ start +'</a></li>'); }else{ obj.append('<li class="active"><a href="javascript:;" class="tcdNumber">'+ start +'</a></li>'); } } } if(args.current + 2 < args.pageCount - 1 && args.current >= 1 && args.pageCount > 5){ obj.append('<li><a href="javascript:;">...</a></li>'); } if(args.current != args.pageCount && args.current < args.pageCount -2  && args.pageCount != 4){ obj.append('<li><a href="javascript:;" class="tcdNumber">'+args.pageCount+'</a></li>'); }   if(args.current < args.pageCount){ obj.append('<li class="next"><a href="javascript:;">后一页</a></li>'); }else{ obj.append('<li class="next disabled"><a href="javascript:;">后一页</a></li>'); }   obj.append('<li><span class="topages" style="font-size:14px;color:#2fa4e7;padding:0px;">&nbsp;&nbsp;到第\ <input type="text" class="page_number" style="width: 50px;height:34px;color:#000;padding:5px;"\ value="'+(args.current>args.pages?args.pages:args.current)+'" />页&nbsp;&nbsp;</span>\ <button type="button" class="btn btn-default page_submit" style="height:35px;color:#2fa4e7;">确定</button></li>'); })(); }, event : function(obj, args) { var __this = this; return (function(){ obj.find("li>a.tcdNumber").unbind("click").click(function(){ __this.options.current = parseInt($(this).text()); __this.options.data.page = __this.options.current, __this.initGrid(); }); obj.find("li.prev").unbind("click").click(function(){ __this.options.current = parseInt(args.current-1); __this.options.data.page = __this.options.current, __this.initGrid(); }); obj.find("li.next").unbind("click").click(function(){ __this.options.current = parseInt(args.current+1); __this.options.data.page = __this.options.current, __this.initGrid(); }); obj.find("button.page_submit").unbind("click").click(function(){ var value = $(__this.$element).find('input.page_number').val(); var number = parseInt($.trim(value)); var pages = __this.options.pageCount; if(isNaN(number)){ $.messager.alert('错误', '请输入正确的数字！', 'error'); return; } else if (number < 1) { number = 1; } else { number = number>pages?pages:number; } __this.options.data.page = number; __this.options.current = number; __this.initGrid(); }); })(); }, Div : function(exp1, exp2) { var n1 = Math.round(exp1); var n2 = Math.round(exp2); var rslt = n1 / n2; if (rslt >= 0) { rslt = Math.floor(rslt); } else { rslt = Math.ceil(rslt); } return rslt; } };   $.fn.splitPage = function(options) { var splitPageDiv = new SplitPageDiv(this, options); return splitPageDiv.initGrid(); }; })(jQuery);