//window._={}; (function(_){ if (!_) return; _.pages = function(os){//可以使用name來綁定click事件,再取page/li屬性使用 //console.log(os); var ops = { count:0 //記錄數 , page:0 //當前頁 , li:0 //或目前記錄數 , pre:'jsPage' //class,id之類首碼 , side:5 //當前頁左右數字頁個數 , per:5 //每頁條數 , first:'' //顯示首頁(字元) , last:'' //顯示末頁(字元) , prev:'' //顯示上頁(字元) , next:'' //顯示下頁(字元) , prevg:'' //前節(字元):足夠前移一組,且不是1 , nextg:'' //後節(字元):足夠後移一組,且不是末頁 , url:'javascript:;' //page的url,放置字元*會替換成頁碼 , target:'_self' //頁碼開啟視窗 , jump:'' //跳轉form的action,*替換成輸入頁碼, , attrs:'' //附加到a標籤上的其它js屬性,如data="11" pid="2" aid="3" }; var ma = function(p,t,c,a){return '<a ' +(strN0(ops.attrs) ? ops.attrs:'')+ ' href="' +purl(p)+ '" class="' +ops.pre+(c ? c : 'Pages')+ '" target="' +ops.target+ '" page="' +p+ '" li="' +(p*ops.per)+ '" name="' +ops.pre+ 'Pages" title="' +(a ? a : '點擊開啟第' +p+ '頁')+ '">' +(t ? t : p)+ '</a>\n'}; var isset = function(v){return 'undefined' != typeof v;}; var strN0 = function(v){return 'string' == typeof(v) && !/^\s*$/.test(v) ? 1 : 0;};//非Null 字元 for (var o in os) isset(ops[o]) && (ops[o] = os[o]); var overp = function(n){return n>ops.maxp ? ops.maxp : n;};//大於最大頁回最大頁 var pages = ''; var p2l = function(p){return p*ops.per};//頁轉記錄數 var purl = function(p){return ops.url.replace('*', p);};//返回頁碼url (isNaN(ops.per) || ops.per < 1) && (ops.per = 5); if (isNaN(ops.count) || !ops.count || (ops.count <= ops.per) ) return pages;//只有一頁 ops.maxp = Math.floor(ops.count/ops.per) + (ops.count%ops.per ? 1 : 0);//最大頁 if (0 < ops.li) { ops.li > ops.count && (ops.li = ops.count); ops.page = Math.floor(ops.li/ops.per) + (ops.li%ops.per ? 1 :0);//資料位元移轉換成頁,餘+1 } else if (ops.page > 1){ ops.page > ops.maxp && (ops.page = ops.maxp); ops.li = ops.page*ops.per; } else { ops.li = 0; ops.page = 1; } ops.nums = ops.side*2+1;//總數字頁為*2+1 if (ops.page > ops.side+1) {//只有前面出現省略時才需要出現 if (strN0(ops.first)) pages += ma(1,ops.first,'first'); if (strN0(ops.prev)) pages += ma(ops.page-1,ops.prev,'prev'); } var prevp = ops.page - ops.nums; if (strN0(ops.prevg) && prevp > 1 ) pages += ma(prevp,ops.prevg,'prevg');//只有前面出現省略時才需要出現,1已經有首頁不必出現 for (var fi = ops.side, sidel=sider='',pl=pr=ops.page;fi >0; fi--) { if (--pl >= 1) sidel = ma(pl) + sidel; if (++pr <= ops.maxp) sider += ma(pr); } pages += sidel + '<a href="javascript:;" target="_self" class="' +ops.pre+ 'Page" title="當前頁頁碼">' +ops.page+ '</a>'+ sider; var nextp = ops.page + ops.nums; if (strN0(ops.nextg) && ops.maxp > nextp ) pages += ma(nextp,ops.nextg, 'nextg');//只有後面不顯全 //跳轉 if (strN0(ops.jump) && (ops.page > ops.side || ops.maxp-ops.page >ops.side)) pages += '<form target="' +ops.target+ '" class="' +ops.pre+ 'form" method="POST" onsubmit="' + "return (function(t){var i=t.elements[0];i=i.value=i.value.replace(/\\D/g,'');return i>0?t.action='" +ops.jump+ "'.replace('*', i):false;})(this);" + '">\n' + '<input class="' +ops.pre+ 'input" title="輸入合法的頁碼,斷行符號確認跳轉到輸入的頁"/>' + '</form>\n'; if (ops.maxp- ops.page > ops.side) {//只有後面不顯全 if (strN0(ops.next)) pages += ma(ops.page+1,ops.next,'next'); if (strN0(ops.last)) pages += ma(ops.maxp,ops.last, 'last'); } return pages; } })(window._); //document.body.innerHTML = _.pages({count:13, page:1, per:1, side:1, first:'f', prev:'p', next:'n', last:'l', nextg:'>>>', prevg:'<<<', jump:'http://local.q/?kkkk=*', target:'_blank'});
js點擊應用樣本: //分頁點擊 $('#listsBar a[name="jsPagePages"]').click(function(){ var pid = $(this).attr('pid')*1; var page = $(this).attr('page')*1; $('#commentBox' +pid+ ' div.atBoxPage' +pid).hide();//其它全部隱藏 $('#atBoxPage' +pid+ '_' +page).show();//顯示當前頁 });原理分析:頁面中分頁10個,第1頁顯示,其它頁隱藏,每個分頁div的class="atBoxPage+pid",且id='atBoxPage+pid_+page',在1頁點擊2頁,先用類取得所有的10個分頁隱藏,然後用id取得2頁顯示