jQuery Ajax 實(shí)現(xiàn)分頁(yè) kkpager插件實(shí)例代碼
更新時(shí)間：2017年08月10日 14:43:48 作者：秋風(fēng)過(guò)、枯葉落
本文通過(guò)實(shí)例代碼給大家講解了jQuery Ajax 實(shí)現(xiàn)分頁(yè) kkpager插件功能，需要的的朋友參考下吧
代碼片段一：
<!--分頁(yè)組件 JS CSS 開(kāi)始--> <!--分頁(yè)組件 CSS--> <link type="text/css" href="/resource/css/kkpager_blue.css" rel="external nofollow" rel="stylesheet" /> <!--分頁(yè)組件 JS--> <script type="text/javascript" src="/resource/js/kkpager.min.js"></script> <script type="text/javascript" src="/resource/js/kkpager.js"></script> <!--分頁(yè)組件 JS CSS 結(jié)束-->
代碼片段二：
<script type="text/javascript">
$(function () {
//----分頁(yè)部分 代碼片段一 開(kāi)始----
var totalPage = 20;//總共多少頁(yè)
var totalRecords = 200;//總共多少條
var pagehref = window.location.href;
var pageNo = GetQueryString('pno');
if (!pageNo) {
pageNo = 1;
}
//----分頁(yè)部分 代碼片段一 結(jié)束----
//----頁(yè)面數(shù)據(jù)加載 并綁定生成分頁(yè) 開(kāi)始----
function LoadingGoods() {
jQuery.ajax({
url: 'baidu.com',
type: "POST",
dataType: "json",
data: { '參數(shù)1': 1, '參數(shù)2': 2,'Page': pageNo, 'Limit': 20 },
success: function (result) {
if (result.success) {
var count = result.result;
var data = result.data;
totalRecords = count;
totalPage = Math.ceil(count / 20);
if (count > 0) {
$(".commodity_volume").html("");
var str = "";
for (var i = 0; i < data.length; i++) {
str += "<div class='commodity'></div>";
}
$(".commodity_volume").html(str);
} else {
$(".commodity_volume").html("");
var str = "";
str = "<div><center>沒(méi)有查到您想要的數(shù)據(jù)。</center></div>"
$(".commodity_volume").html(str);
}
//----分頁(yè)部分 代碼片段二 開(kāi)始----
kkpager.total = totalPage;
kkpager.totalRecords = totalRecords;
kkpager.generPageHtml({
pno: pageNo,
//總頁(yè)碼
total: totalPage,
//總數(shù)據(jù)條數(shù)
totalRecords: totalRecords,
//mode: 'click',
//鏈接前部
hrefFormer: pagehref,
//鏈接尾部
hrefLatter: '',//hrefLatter: '.html'
getLink: function (n) {
var hrefFormer = this.hrefFormer;
var url = this.hrefFormer + "&pno=" + n;
if (hrefFormer.indexOf("pno") > 0) {
var pno = GetQueryString("pno");
return this.hrefFormer.replace('pno=' + pno, 'pno=' + n);
} else {
return url;
}
}
});
//----分頁(yè)部分 代碼片段二 結(jié)束----
//----顯示遮罩 開(kāi)始----
$('#AjaxLoading').hide()
$(".showbox").stop(true).animate({ 'margin-top': '250px', 'opacity': '0' }, 400);
$(".overlay").css({ 'display': 'none', 'opacity': '0' });
//----顯示遮罩 結(jié)束----
}
},
error: function () {
alert("請(qǐng)刷新后重試！")
}
});
}
LoadingGoods();//加載商品列表
//----頁(yè)面數(shù)據(jù)加載 并綁定生成分頁(yè) 結(jié)束----
} </script>
代碼片段三：
<div id="kkpager"></div>
下面這段代碼：在原版上修改過(guò)，由于ajax分頁(yè)不能及時(shí)更新總頁(yè)數(shù)
下面是插件kkpager.js代碼：
/*
kkpager V1.3
https://github.com/pgkk/kkpager
Copyright (c) 2013 cqzhangkang@163.com
Licensed under the GNU GENERAL PUBLIC LICENSE
*/
var kkpager = {
pagerid : 'kkpager', //divID
mode : 'link', //模式(link 或者 click)
pno : 1, //當(dāng)前頁(yè)碼
total : 1, //總頁(yè)碼
totalRecords : 0, //總數(shù)據(jù)條數(shù)
isShowFirstPageBtn : true, //是否顯示首頁(yè)按鈕
isShowLastPageBtn : true, //是否顯示尾頁(yè)按鈕
isShowPrePageBtn : true, //是否顯示上一頁(yè)按鈕
isShowNextPageBtn : true, //是否顯示下一頁(yè)按鈕
isShowTotalPage : true, //是否顯示總頁(yè)數(shù)
isShowCurrPage : true,//是否顯示當(dāng)前頁(yè)
isShowTotalRecords : false, //是否顯示總記錄數(shù)
isGoPage : true, //是否顯示頁(yè)碼跳轉(zhuǎn)輸入框
isWrapedPageBtns : true, //是否用span包裹住頁(yè)碼按鈕
isWrapedInfoTextAndGoPageBtn : true, //是否用span包裹住分頁(yè)信息和跳轉(zhuǎn)按鈕
hrefFormer : '', //鏈接前部
hrefLatter : '', //鏈接尾部
gopageWrapId : 'kkpager_gopage_wrap',
gopageButtonId : 'kkpager_btn_go',
gopageTextboxId : 'kkpager_btn_go_input',
lang : {
firstPageText : '首頁(yè)',
firstPageTipText : '首頁(yè)',
lastPageText : '尾頁(yè)',
lastPageTipText : '尾頁(yè)',
prePageText : '上一頁(yè)',
prePageTipText : '上一頁(yè)',
nextPageText : '下一頁(yè)',
nextPageTipText : '下一頁(yè)',
totalPageBeforeText : '共',
totalPageAfterText : '頁(yè)',
currPageBeforeText : '當(dāng)前第',
currPageAfterText : '頁(yè)',
totalInfoSplitStr : '/',
totalRecordsBeforeText : '共',
totalRecordsAfterText : '條數(shù)據(jù)',
gopageBeforeText : ' 轉(zhuǎn)到',
gopageButtonOkText : '確定',
gopageAfterText : '頁(yè)',
buttonTipBeforeText : '第',
buttonTipAfterText : '頁(yè)'
},
//鏈接算法（當(dāng)處于link模式）,參數(shù)n為頁(yè)碼
getLink : function(n){
//這里的算法適用于比如：
//hrefFormer=http://www.xx.com/news/20131212
//hrefLatter=.html
//那么首頁(yè)（第1頁(yè)）就是http://www.xx.com/news/20131212.html
//第2頁(yè)就是http://www.xx.com/news/20131212_2.html
//第n頁(yè)就是http://www.xx.com/news/20131212_n.html
if(n == 1){
return this.hrefFormer + this.hrefLatter;
}
return this.hrefFormer + '_' + n + this.hrefLatter;
},
//頁(yè)碼單擊事件處理函數(shù)（當(dāng)處于mode模式）,參數(shù)n為頁(yè)碼
click : function(n){
//這里自己實(shí)現(xiàn)
//這里可以用this或者kkpager訪問(wèn)kkpager對(duì)象
return false;
},
//獲取href的值（當(dāng)處于mode模式）,參數(shù)n為頁(yè)碼
getHref : function(n){
//默認(rèn)返回'#'
return '#';
},
//跳轉(zhuǎn)框得到輸入焦點(diǎn)時(shí)
focus_gopage : function (){
var btnGo = $('#'+this.gopageButtonId);
$('#'+this.gopageTextboxId).attr('hideFocus',true);
btnGo.show();
btnGo.css('left','10px');
$('#'+this.gopageTextboxId).addClass('focus');
btnGo.animate({left: '+=30'}, 50);
},
//跳轉(zhuǎn)框失去輸入焦點(diǎn)時(shí)
blur_gopage : function(){
var _this = this;
setTimeout(function(){
var btnGo = $('#'+_this.gopageButtonId);
btnGo.animate({
left: '-=25'
}, 100, function(){
btnGo.hide();
$('#'+_this.gopageTextboxId).removeClass('focus');
});
},400);
},
//跳轉(zhuǎn)輸入框按鍵操作
keypress_gopage : function(){
var event = arguments[0] || window.event;
var code = event.keyCode || event.charCode;
//delete key
if(code == 8) return true;
//enter key
if(code == 13){
kkpager.gopage();
return false;
}
//copy and paste
if(event.ctrlKey && (code == 99 || code == 118)) return true;
//only number key
if(code<48 || code>57)return false;
return true;
},
//跳轉(zhuǎn)框頁(yè)面跳轉(zhuǎn)
gopage : function(){
var str_page = $('#'+this.gopageTextboxId).val();
if(isNaN(str_page)){
$('#'+this.gopageTextboxId).val(this.next);
return;
}
var n = parseInt(str_page);
if(n < 1) n = 1;
if(n > this.total) n = this.total;
if(this.mode == 'click'){
this._clickHandler(n);
}else{
window.location = this.getLink(n);
}
},
//不刷新頁(yè)面直接手動(dòng)調(diào)用選中某一頁(yè)碼
selectPage : function(n){
this._config['pno'] = n;
this.generPageHtml(this._config,true);
},
//生成控件代碼
generPageHtml : function(config,enforceInit){
if (enforceInit || !this.inited) {
config.total = kkpager.total;
config.totalRecords = kkpager.totalRecords;
this.init(config);
}
var str_first='',str_prv='',str_next='',str_last='';
if(this.isShowFirstPageBtn){
if(this.hasPrv){
str_first = '<a '+this._getHandlerStr(1)+' title="'
+(this.lang.firstPageTipText || this.lang.firstPageText)+'">'+this.lang.firstPageText+'</a>';
}else{
str_first = '<span class="disabled">'+this.lang.firstPageText+'</span>';
}
}
if(this.isShowPrePageBtn){
if(this.hasPrv){
str_prv = '<a '+this._getHandlerStr(this.prv)+' title="'
+(this.lang.prePageTipText || this.lang.prePageText)+'">'+this.lang.prePageText+'</a>';
}else{
str_prv = '<span class="disabled">'+this.lang.prePageText+'</span>';
}
}
if(this.isShowNextPageBtn){
if(this.hasNext){
str_next = '<a '+this._getHandlerStr(this.next)+' title="'
+(this.lang.nextPageTipText || this.lang.nextPageText)+'">'+this.lang.nextPageText+'</a>';
}else{
str_next = '<span class="disabled">'+this.lang.nextPageText+'</span>';
}
}
if(this.isShowLastPageBtn){
if(this.hasNext){
str_last = '<a '+this._getHandlerStr(this.total)+' title="'
+(this.lang.lastPageTipText || this.lang.lastPageText)+'">'+this.lang.lastPageText+'</a>';
}else{
str_last = '<span class="disabled">'+this.lang.lastPageText+'</span>';
}
}
var str = '';
var dot = '<span class="spanDot">...</span>';
var total_info='<span class="totalText">';
var total_info_splitstr = '<span class="totalInfoSplitStr">'+this.lang.totalInfoSplitStr+'</span>';
if(this.isShowCurrPage){
total_info += this.lang.currPageBeforeText + '<span class="currPageNum">' + this.pno + '</span>' + this.lang.currPageAfterText;
if(this.isShowTotalPage){
total_info += total_info_splitstr;
total_info += this.lang.totalPageBeforeText + '<span class="totalPageNum">'+this.total + '</span>' + this.lang.totalPageAfterText;
}else if(this.isShowTotalRecords){
total_info += total_info_splitstr;
total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
}
}else if(this.isShowTotalPage){
total_info += this.lang.totalPageBeforeText + '<span class="totalPageNum">'+this.total + '</span>' + this.lang.totalPageAfterText;;
if(this.isShowTotalRecords){
total_info += total_info_splitstr;
total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
}
}else if(this.isShowTotalRecords){
total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
}
total_info += '</span>';
var gopage_info = '';
if(this.isGoPage){
gopage_info = '<span class="goPageBox">'+this.lang.gopageBeforeText+'<span id="'+this.gopageWrapId+'">'+
'<input type="button" id="'+this.gopageButtonId+'" onclick="kkpager.gopage()" value="'
+this.lang.gopageButtonOkText+'" />'+
'<input type="text" id="'+this.gopageTextboxId+'" onfocus="kkpager.focus_gopage()" onkeypress="return kkpager.keypress_gopage(event);" onblur="kkpager.blur_gopage()" value="'+this.next+'" /></span>'+this.lang.gopageAfterText+'</span>';
}
//分頁(yè)處理
if(this.total <= 8){
for(var i=1;i<=this.total;i++){
if(this.pno == i){
str += '<span class="curr">'+i+'</span>';
}else{
str += '<a '+this._getHandlerStr(i)+' title="'
+this.lang.buttonTipBeforeText + i + this.lang.buttonTipAfterText+'">'+i+'</a>';
}
}
}else{
if(this.pno <= 5){
for(var i=1;i<=7;i++){
if(this.pno == i){
str += '<span class="curr">'+i+'</span>';
}else{
str += '<a '+this._getHandlerStr(i)+' title="'+
this.lang.buttonTipBeforeText + i + this.lang.buttonTipAfterText+'">'+i+'</a>';
}
}
str += dot;
}else{
str += '<a '+this._getHandlerStr(1)+' title="'
+this.lang.buttonTipBeforeText + '1' + this.lang.buttonTipAfterText+'">1</a>';
str += '<a '+this._getHandlerStr(2)+' title="'
+this.lang.buttonTipBeforeText + '2' + this.lang.buttonTipAfterText +'">2</a>';
str += dot;
var begin = this.pno - 2;
var end = this.pno + 2;
if(end > this.total){
end = this.total;
begin = end - 4;
if(this.pno - begin < 2){
begin = begin-1;
}
}else if(end + 1 == this.total){
end = this.total;
}
for(var i=begin;i<=end;i++){
if(this.pno == i){
str += '<span class="curr">'+i+'</span>';
}else{
str += '<a '+this._getHandlerStr(i)+' title="'
+this.lang.buttonTipBeforeText + i + this.lang.buttonTipAfterText+'">'+i+'</a>';
}
}
if(end != this.total){
str += dot;
}
}
}
var pagerHtml = '<div>';
if(this.isWrapedPageBtns){
pagerHtml += '<span class="pageBtnWrap">' + str_first + str_prv + str + str_next + str_last + '</span>'
}else{
pagerHtml += str_first + str_prv + str + str_next + str_last;
}
if(this.isWrapedInfoTextAndGoPageBtn){
pagerHtml += '<span class="infoTextAndGoPageBtnWrap">' + total_info + gopage_info + '</span>';
}else{
pagerHtml += total_info + gopage_info;
}
pagerHtml += '</div><div style="clear:both;"></div>';
$("#"+this.pagerid).html(pagerHtml);
},
//分頁(yè)按鈕控件初始化
init : function(config){
this.pno = isNaN(config.pno) ? 1 : parseInt(config.pno);
this.total = isNaN(config.total) ? 1 : parseInt(config.total);
this.totalRecords = isNaN(config.totalRecords) ? 0 : parseInt(config.totalRecords);
if(config.pagerid){this.pagerid = config.pagerid;}
if(config.mode){this.mode = config.mode;}
if(config.gopageWrapId){this.gopageWrapId = config.gopageWrapId;}
if(config.gopageButtonId){this.gopageButtonId = config.gopageButtonId;}
if(config.gopageTextboxId){this.gopageTextboxId = config.gopageTextboxId;}
if(config.isShowFirstPageBtn != undefined){this.isShowFirstPageBtn=config.isShowFirstPageBtn;}
if(config.isShowLastPageBtn != undefined){this.isShowLastPageBtn=config.isShowLastPageBtn;}
if(config.isShowPrePageBtn != undefined){this.isShowPrePageBtn=config.isShowPrePageBtn;}
if(config.isShowNextPageBtn != undefined){this.isShowNextPageBtn=config.isShowNextPageBtn;}
if(config.isShowTotalPage != undefined){this.isShowTotalPage=config.isShowTotalPage;}
if(config.isShowCurrPage != undefined){this.isShowCurrPage=config.isShowCurrPage;}
if(config.isShowTotalRecords != undefined){this.isShowTotalRecords=config.isShowTotalRecords;}
if(config.isWrapedPageBtns){this.isWrapedPageBtns=config.isWrapedPageBtns;}
if(config.isWrapedInfoTextAndGoPageBtn){this.isWrapedInfoTextAndGoPageBtn=config.isWrapedInfoTextAndGoPageBtn;}
if(config.isGoPage != undefined){this.isGoPage=config.isGoPage;}
if(config.lang){
for(var key in config.lang){
this.lang[key] = config.lang[key];
}
}
this.hrefFormer = config.hrefFormer || '';
this.hrefLatter = config.hrefLatter || '';
if(config.getLink && typeof(config.getLink) == 'function'){this.getLink = config.getLink;}
if(config.click && typeof(config.click) == 'function'){this.click = config.click;}
if(config.getHref && typeof(config.getHref) == 'function'){this.getHref = config.getHref;}
if(!this._config){
this._config = config;
}
//validate
if(this.pno < 1) this.pno = 1;
this.total = (this.total <= 1) ? 1: this.total;
if(this.pno > this.total) this.pno = this.total;
this.prv = (this.pno<=2) ? 1 : (this.pno-1);
this.next = (this.pno >= this.total-1) ? this.total : (this.pno + 1);
this.hasPrv = (this.pno > 1);
this.hasNext = (this.pno < this.total);
this.inited = true;
},
_getHandlerStr : function(n){
if(this.mode == 'click'){
return 'href="'+this.getHref(n)+'" rel="external nofollow" onclick="return kkpager._clickHandler('+n+')"';
}
//link模式，也是默認(rèn)的
return 'href="'+this.getLink(n)+'" rel="external nofollow" ';
},
_clickHandler : function(n){
var res = false;
if(this.click && typeof this.click == 'function'){
res = this.click.call(this,n) || false;
}
return res;
}
};
下面是插件kkpager_blue.css代碼：
#kkpager{
clear:both;
color:#999;
padding:5px 0px 5px 0px;
font-size:13px;
}
#kkpager a{
float: left;
border: 1px solid #ccc;
display: inline;
padding: 3px 10px 3px 10px;
margin-right: 5px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
cursor: pointer;
background: #fff;
text-decoration:none;
color:#999;
}
#kkpager span.disabled{
float: left;
display: inline;
padding: 3px 10px 3px 10px;
margin-right: 5px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border:1px solid #DFDFDF;
background-color:#FFF;
color:#DFDFDF;
}
#kkpager span.curr{
float: left;
border: 1px solid #31ACE2;
display: inline;
padding: 3px 10px 3px 10px;
margin-right: 5px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #F0FDFF;
color: #31ACE2;
}
#kkpager a:hover{
border:1px solid #31ACE2;
background-color:#31ACE2;
color:#fff;
}
#kkpager span.normalsize{
}
#kkpager_gopage_wrap{
position:relative;
left:0px;
top:0px;
}
#kkpager_btn_go {
width:44px;
height:18px;
border:0px;
overflow:hidden;
line-height:140%;
padding:0px;
margin:0px;
text-align:center;
cursor:pointer;
background-color:#31ACE2;
color:#FFF;
position:absolute;
left:0px;
top:-2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
display:none;
}
#kkpager_btn_go_input{
width:36px;
height:14px;
color:#999;
text-align:center;
margin-left:1px;
margin-right:1px;
border:1px solid #DFDFDF;
position:relative;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
left:0px;
top:0px;
outline:none;
}
#kkpager_btn_go_input.focus{
border-color:#31ACE2;
}
#kkpager .pageBtnWrap{
float:left;
}
#kkpager .infoTextAndGoPageBtnWrap{
float:right;
}
#kkpager .spanDot{
float:left;
margin-right:5px;
}
#kkpager .currPageNum{
color:#FD7F4D;
}
#kkpager .infoTextAndGoPageBtnWrap{
padding-top:5px;
}
總結(jié)
以上所述是小編給大家介紹的jQuery Ajax 實(shí)現(xiàn)分頁(yè) kkpager插件，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
您可能感興趣的文章:
- jQuery插件DataTables分頁(yè)開(kāi)發(fā)心得體會(huì)
- jQuery條件分頁(yè) 代替離線(xiàn)查詢(xún)（附代碼）
- 快速掌握jquery分頁(yè)插件jqPaginator的使用方法
- jQuery Pagination分頁(yè)插件_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
- 基于jQuery封裝的分頁(yè)組件
- jQuery給表格添加分頁(yè)效果
- jQuery實(shí)現(xiàn)ajax無(wú)刷新分頁(yè)頁(yè)碼控件
- jQuery實(shí)現(xiàn)頁(yè)碼跳轉(zhuǎn)式動(dòng)態(tài)數(shù)據(jù)分頁(yè)
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了jquery插件實(shí)現(xiàn)搜索歷史，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-04-04
本篇文章主要是對(duì)jquery中常用的函數(shù)和屬性進(jìn)行了詳細(xì)的介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-03-03
使用JQuery實(shí)現(xiàn)圖片輪播效果的實(shí)例(推薦)
下面小編就為大家?guī)?lái)一篇使用JQuery實(shí)現(xiàn)圖片輪播效果的實(shí)例(推薦)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10
鼠標(biāo)拖動(dòng)實(shí)現(xiàn)DIV排序示例代碼
鼠標(biāo)拖動(dòng)實(shí)現(xiàn)DIV排序的教程有很多，在本文將為大家詳細(xì)介紹個(gè)不錯(cuò)的示例，對(duì)比傳統(tǒng)的排序，這是一個(gè)很不錯(cuò)的嘗試2013-10-10
jquery插件orbit.js實(shí)現(xiàn)圖片折疊輪換特效
Orbit是一個(gè)設(shè)計(jì)良好并且容易使用的jQuery圖片滑動(dòng)幻燈片插件，它除了支持圖片滾動(dòng)切換展示外，還支持針對(duì)內(nèi)容的滾動(dòng)。插件的定制性相當(dāng)高，它提供了多個(gè)參數(shù)的設(shè)置，通過(guò)設(shè)置你可以將它打造成完全符合你要求的樣式。2015-04-04
這篇文章主要為大家詳細(xì)介紹了基于jquery實(shí)現(xiàn)五子棋游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-05-05
下面小編就為大家?guī)?lái)一篇基于hover的用法實(shí)例(推薦)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
基于jQuery的網(wǎng)頁(yè)右下角彈出廣告(IE7,firefox)
以前曾寫(xiě)過(guò)一個(gè),不過(guò)太麻煩了,呵呵```現(xiàn)在改進(jìn)了一下,其實(shí)很簡(jiǎn)單:css定位層一直在右下角,用js控制層的高度增減。2010-08-08
jquery入門(mén)——事件機(jī)制之事件中的冒泡現(xiàn)象示例解釋
事件被觸發(fā)后被分為兩個(gè)階段，一個(gè)是捕獲（Capture），另一個(gè)是冒泡(Bubbing)，但大多瀏覽器并不是都支持捕獲階段，因此事件被觸發(fā)后，往往執(zhí)行冒泡過(guò)程,感興趣的朋友可以了解下，或許對(duì)你學(xué)習(xí)事件機(jī)制有所幫助2013-02-02
基于zepto的移動(dòng)端輕量級(jí)日期插件--date_picker
這篇文章主要介紹了基于zepto的移動(dòng)端輕量級(jí)日期插件--date_picker,需要的朋友可以參考下2016-03-03