pagination用法：
1、html
要用两层div
<script src="${app }/pc/js/media/pagination.js"></script>
<div class="col-md-12 col-sm-12 col-lg-12 bgwhite mt15" id="courseList">
<div class="row courseList2">
</div>
</div>
2、js
1 function courseList(){ 2 var $colsm = $("#courseList"), 3 $mediamanager = $(".courseList2"); 4 5 $colsm.pagination({ 6 dataSource:sUrl.selectStudioActivityInfo, 7 paginationDetail: false, 8 showTotalPage : true, 9 pageSize :10,/////分页要注意这里的问题 10 locator: "body.studioActivities", 11 alias: { 12 pageNumber: 'pageNum', 13 pageSize: 'pageSize' 14 }, 15 ajax: { 16 type:"POST", 17 data:{ 18 "pageSize":"10", 19 "addressId" :storageAddressId, 20 "token" : token, 21 "institutionId":institutionId, 22 23 "activityName":$("#my_actName").val(), 24 "status":$("#my_actStatu").val(), 25 "activityType":$("#my_actType").val(), 26 27 "year":$("#my_actYear").val(), 28 "categoryCode":$("#my_actFirstMajor").val(), 29 "majorCode":$("#my_actSeconMajor").val(), 30 }, 31 beforeSend: function(jqXHR, settings) { 32 $mediamanager.html('数据加载中，请稍后 ...'); 33 } 34 }, 35 pageList: [12], 36 callback: function(data, pagination){ 37 var html = template3(data); 38 $mediamanager.html(html); 39 $mediamanager.off( "click", ".thmb-prev"); 40 $mediamanager.on( "click", ".thmb-prev", function(){//点击预览 41 var $this = $(this), 42 _id = $this.attr("id"); 43 preActivityModal(_id); 44 applayerNameMY(_id); 45 }) 46 //点击编辑 47 $mediamanager.on( "click", ".editCourse", function() {//删除 48 var $this = $(this), 49 _id = $this.attr("id"); 50 $.data($('#addCourseModal')[0],"id",_id); 51 editCourseModal(); 52 }) 53 //下架：4 上架：2 提交审核：1 54 $mediamanager.off( "click", ".shelves"); 55 $mediamanager.on( "click", ".shelves", function() { 56 var $this = $(this), 57 _id = $this.attr("id"); 58 _status = $this.attr("data-status"); 59 // $thmb = $this.closest(".thmb"), 60 // $thmbPrev = $thmb.find(".thmb-prev"), 61 // _postId = $thmbPrev.attr("postId"), 62 // _tableName = $thmbPrev.attr("tableName"); 63 var text = '确定要'+$(this).text()+'吗？'; 64 App.alert({ 65 title: "系统提示", 66 text: text, 67 type: "warning", 68 showCancelButton: true, 69 confirmButtonColor: '#DD6B55', 70 confirmButtonText: '确定', 71 cancelButtonText: "取消", 72 closeOnConfirm: false 73 }, 74 function(isConfirm){ 75 if (isConfirm){ 76 sercice(sUrl.updateStudioActivityStatus, function(data){ 77 if(data.success){ 78 App.alert("系统提示",data.msg,"success"); 79 $colsm.pagination('destroy'); 80 courseList(); 81 }else{ 82 App.alert("系统提示",data.msg,"error"); 83 } 84 85 }, { 86 "id" :_id, 87 "addressId" :storageAddressId, 88 "token":token, 89 "status":_status 90 }); 91 } 92 }) 93 94 }) 95 96 }//callback结束 97 }) 98 } 99 function template3(data) { 100 var html = ''; 101 $.each(data, function(index, item) { 102 var id = item.id || ""; 103 104 var thumb = ""; 105 106 var thumb = item.cover ? "http://artapp-dev-bucket.oss-cn-beijing.aliyuncs.com/"+item.cover : path + "/pc/images/media/default.png"; 107 108 var courseName = item.activityName || ""; 109 var amount = item.amount/100;//课程价格 110 111 var status = item.status;//课程状态 112 var statusDesc = item.statusDesc;//状态描述 113 114 var createTime = item.createTime;//状态描述 115 var createTime = new Date(createTime); 116 var time1 = createTime.getFullYear()+ '/'+ ((createTime.getMonth() + 1)<10?'0'+(createTime.getMonth() + 1):(createTime.getMonth() + 1))+ '/'+ (createTime.getDate() < 10 ? '0'+createTime.getDate() : createTime.getDate()); 117 118 var regNumber = item.regNumber;//已报名 119 var totalNumber = item.totalNumber;//总 120 121 var edit =''; 122 var statusDesc =''; 123 //删除：3 发布：1 结束：2 124 if(status=="0"||status=="10"){//status 1(显示 发布) 2(上架，显示) 4(下架，显示上架操作) 125 edit += '<span class="pull-left inlineB corred mr10 cursor shelves" id="' + id + '" data-status="1">发布</span>'; 126 edit += '<span class="pull-left inlineB corred mr10 cursor editCourse" id="' + id + '" data-status="'+status+'">编辑</span>'; 127 statusDesc = '未发布'; 128 }else if(status=="1"||status=="11"){ 129 edit += '<span class="pull-left inlineB corred mr10 cursor shelves" id="' + id + '" data-status="2"> 结束</span>'; 130 statusDesc = '已发布'; 131 } 132 else if(status=="2"){ 133 statusDesc = '已结束'; 134 } 135 console.log(status); 136 137 html += '<div class="col-lg-3 col-xs-6 col-sm-4 col-md-3 video videohover mt15">'; 138 html += '<div class="thmb cursor" style="height:250px;position:relative;">'; 139 html += '<div class="caozuo">'; 140 html += '<div class="ckbox ckbox-default pull-left" style="display:none;">'; 141 html += '<input type="checkbox" onchange="chooseSingle(this)" id="check'+index+'" name="videoCollect" value="'+id+'" />'; 142 html += '<label for="check'+index+'"></label>'; 143 html += '</div>'; 144 html += '</div>'; 145 html += '<div class="thmb-prev" id="' + id + '" style="width:100%;height:68%;background:url('+thumb+') no-repeat center center;background-size: cover;position:relative;">'; 146 html += '<span class="no_open text-center">'+statusDesc+'</span>'; 147 html += '<p class="detailAmount">报名人数：'+'<span class="corred">'+regNumber+'</span>'+'/'+totalNumber+'</p>'; 148 html += '</div>'; 149 html += '<div class="mt10 clearfix">'+'<span class="pull-left">'+courseName+'</span>'+'<span class="corred pull-right">¥'+amount+'</span>'+'</div>'; 150 html += '<div class="mt15 clearfix dflexL relative">'; 151 html += '<span>'+edit+'</span>'; 152 html += '<span class="pull-left corred mr5 cursor shelves" id="' + id + '" data-status="3">删除</span>'; 153 html += '<span class="pull-right absolute" style="width:70px;float:right!important;right:0">'+time1+'</span>'; 154 html += '</div>'; 155 html += '</div>'; 156 html +='</div>'; 157 }); 158 html += ''; 159 return html; 160 }