前台html
?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 | <!doctype html><html><head><meta charset="utf-8"><meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" id="viewport" name="viewport"><title>通知公告列表</title><link rel="stylesheet" href="../css/pagination.css" type="text/css"></link> <script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="../js/jquery.pagination.js"></script> <style>.page{width:95%;height:770px;margin:0 auto;padding:10px;border:2px solid #ccc;border-radius:5px;}a{text-decoration:none;color:#489FE8;}</style><script>//var fpURL="url";var fpURL="url";var total=0; $(function(){//页面加载时，进行绑定 $.ajax({type:"get",url:fpURL+"GetZxwj?lx=List",data:"",dataType:"json",beforeSend: function () {$(".img").show();},complete:function(){$(".img").hide();bind(0);},success:function(data){var obj=eval(data);$.each(obj.data,function(index,item){ total=parseInt(item.co);//获取总条数})}})}); //点击分页时调用的函数，page_id为当前页的索引 function pageselectCallback(page_id, jq) { bind(page_id); } var ListArr=[];function bind(pageIndex) { var temp=""; $.ajax({ type:"GET", //url:"sys/news.do?method=findByTopic&page="+(pageIndex+1), url:fpURL+"GetZxwj?lx=zxwjList&ts="+(pageIndex+1),async:false, ////作用是防止在ajax成功调用之前就调用$("#Pagination").pagination,这个时候数据个数还没有初始化 dataType:"json", //data:"pageIndex="+(pageIndex+1),//传递页面索引 data:"",//发送请求前，显示加载动画 beforeSend:function(){$(".img").show();}, //请求完毕后，隐藏加载动画 complete:function(){$(".img").hide();}, success:function(data){ var obj=eval(data);//alert(obj.data.length);//total=obj.data.length;//记录总数 $.each(obj.data,function(index,item){ temp+="<div>"+ "<a style=‘font-size: 18px; font-famliy: 微软雅黑;font-weight:700;‘ OnClick=‘document.location.href=""+ fpURL +" rel="external nofollow" cmp/tzgg/zxwjContent.html?"‘ >"+ item.wjmc+"</a> "+ "<div style=‘font-size: 14px; font-famliy: 宋体; text-indent: 2em; ‘>"+ item.fbrq+" </div> "+"<hr style=‘border:1px solid #ccc;width:100%;‘/>"; }); $("#datas").html(temp); //将创建的新行附加在DIV中 } }); if(total!=0){ //调用分页函数，将分页插件绑定到id为Pagination的div上 $("#Pagination").pagination(total, { //recordCount在后台定义的一个公有变量，通过从数据库查询记录进行赋值，返回记录的总数 callback: pageselectCallback, //点击分页时，调用的回调函数 prev_text: ‘? 上一页‘, //显示上一页按钮的文本 next_text: ‘下一页 ?‘, //显示下一页按钮的文本 items_per_page:12, //每页显示的项数 num_display_entries:4, //分页插件中间显示的按钮数目 current_page:pageIndex, //当前页索引 num_edge_entries:2 //分页插件左右两边显示的按钮数目 }); } } </script></head><body style=""> <div class="img" style="display:none;text-align:center;margin:0 auto;z-index:1000;"><img src="../image/jz.jpg"></div><div class="page"> <div id="datas"> </div> <div id="Pagination" style=""></div> </div> </body> </html>
|