jquery+jquery.pagination+php+ajax 无刷新分页
Posted nowphp
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jquery+jquery.pagination+php+ajax 无刷新分页相关的知识，希望对你有一定的参考价值。
<!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();
?>
以上是关于jquery+jquery.pagination+php+ajax 无刷新分页的主要内容，如果未能解决你的问题，请参考以下文章
jquery+jquery.pagination+php+ajax 无刷新分页