<!DOCTYPE html> <html ><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>预约列表</title> <link rel="stylesheet" href="./static/pagination.css"> <script type="text/javascript" src="./static/jquery.min.js"></script> <script type="text/javascript" src="./static/jquery.pagination.js"></script> <script type="text/javascript"> $(function(){ var num_entries = 10;//先写10,ajax请求后后更新为 16 测试ajax更新页码用 var initPagination = function() { // 创建分页 $("#Pagination").pagination(num_entries, { num_edge_entries: 1, //边缘页数 num_display_entries: 4, //主体页数 callback: pageselectCallback, items_per_page: 1, //每页显示1项 prev_text: "前一页", next_text: "后一页" }); }; function pageselectCallback(page_index, jq){ page_index++; var html=''; $.ajax({ url: "data.php", type: 'post', dataType: 'json', async : false, data:{page:page_index}, success: function (data, status) { count = data.list.length; html += "<table><th>title</th><th>content</th>"; if(count>0){ for(i=0;i<count;i++){ html += "<tr><td>"+data['list'][i].title+"</td><td>"+data['list'][i].content+"</td></tr>"; } } html += "</table>"; } }); $("#Searchresult").html(html); return false; } initPagination(); }); </script> </head> <body> <h1>预约列表</h1> <div id="Pagination" class="pagination"></div> <div id="Searchresult"> </div> </body></html>
php
<?php $data = array( '1'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content'),array("title"=>'111title',"content"=>'1111content'),array("title"=>'111title',"content"=>'1111content')),'page' => 12), '2'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content'),array("title"=>'111title',"content"=>'1111content'),array("title"=>'111title',"content"=>'1111content')),'page' => 12), '3'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '4'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '5'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '6'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '7'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '8'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '9'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '10'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '11'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), '12'=>array('list'=>array(array("title"=>'111title',"content"=>'1111content')),'page' => 16), ); echo json_encode($data[$_POST['page']]); //echo time(); ?>