(编辑:jimmy 日期: 2024/10/4 浏览:2)
扩展JQuery很容易,作为一个练习,编写一个简单的分页插件,代码量不大,直接看代码好了:
$.fn.mypagination = function(totalProperty,opts){ opts = $.extend({ perPage:10, callback:function(){ } },opts||{}); return this.each(function(){ function numPages(){ return Math.ceil(totalProperty/opts.perPage); } function selectPage(page){ return function(){ currPage = page; if (page<0) currPage = 0; if (page>=numPages()) currPage = numPages()-1; render(); $('img.page-wait',panel).attr('src','images/wait.gif'); opts.callback(currPage+1); $('img.page-wait',panel).attr('src','images/nowait.gif'); } } function render(){ var html = '<table><tbody><tr>' +'<td><a href="#"><img class="page-first"></a></td>' +'<td><a href="#"><img class="page-prev"></a></td>' +'<td><span>第<input type="text" class="page-num">页/共'+numPages()+'页</span></td>' +'<td><a href="#"><img class="page-next"></a></td>' +'<td><a href="#"><img class="page-last"></a></td>' +'<td><img src="/UploadFiles/2021-04-02/nowait.gif">下面测试一下: