ajax分页

先将数据库的内容列出在页面

<table class="table">
  <caption>基本的表格布局</caption>
  <thead>
    <tr>
      <th>地区代号</th>
      <th>地区名称</th>
      <th>父级代号</th>
    </tr>
  </thead>
  <tbody id="nr">
    
  </tbody>
</table>
<div style="width:30%; margin:0px auto;">
	<ul class="pagination" id="pagelist">
    
</ul>
</div>
做一个loadData方法LloadPageList方法

　　var pcount = 12;//每一页显示多少条
　　var page = 1;//当前页

<?php
require_once "./dbda/DBDA.class.php";
$db = new DBDA();
$page = $_POST["page"];
$pcount = $_POST["pcount"];
$name = $_POST["name"];
$tj = " 1=1 ";
if(!empty($name)){
	$tj = " areaname like '%{$name}%' ";
}

$tg = ($page-1)*$pcount;
$sql = "select * from chinastates where {$tj} limit {$tg},{$pcount}";
echo $db->jsonquery($sql);

　　上面是load的处理页面

function loadData(){
	var name = $("#name").val();
	$.ajax({
		url:"load.php",
		data:{page:page,pcount:pcount,name:name},
		type:"POST",
		dataType:"JSON",
		success: function(data){
			var str = "";
			/*for(var i=0;i<data.length;i++){
				str += "<tr><td>"+data[i].AreaCode+"</td><td>"+data[i].AreaName+"</td><td>"+data[i].ParentAreaCode+"</td></tr>";
			}*/
			for(var k in data){
				str += "<tr><td>"+data[k].AreaCode+"</td><td>"+data[k].AreaName+"</td><td>"+data[k].ParentAreaCode+"</td></tr>";
			}
			$("#nr").html(str);
		}
	})
}
function loadPageList(){
	var str = "";
	//加载上一页
	str += "<li><a id='prev'>«</a></li>";
	//加载列表
	//向左找两个
	for(var i=page;i>=page-1;i--){
		var p = i-1;
		if(p>0){
			str += "<li><a class='plist'>"+p+"</a></li>";
		}
	}
	//当前页
	str += "<li class='disabled'><a>"+page+"</a></li>";
	//向右找两个
	for(var i=page;i<=page+1;i++){
		var p = i+1;
		var zys = yeShu();
		if(p<=zys){
			str += "<li><a class='plist'>"+p+"</a></li>";
		}
	}

　实现效果如图

　loadpagelist实现分页，然后给分页的class加点击事件

function jiaShiJian(){
	$("#prev").click(function(){
		if(page>1){
			page--;
			loadData();
			loadPageList();
		}else{
			alert("当前已经是第一页了！");
		}
		
	})
	$("#next").click(function(){
		var zye = yeShu();
		if(page<=zye){
			page++;
			loadData();
			loadPageList();
		}else{
			alert("当前已经是最后一页了！");
		}
		
	})
	$(".plist").click(function(){
		 page = parseInt($(this).text());//全局变量
		loadData();
		loadPageList();
	})
}

　做一个页数的方法

function yeShu(){
	var name = $("#name").val();
	var ts = 0;
	$.ajax({
		async:false,
		url:"yeshu.php",
		data:{name:name},
		type:"POST",
		dataType:"TEXT",
		success: function(data){
			ts = data;
		}
		
	})
	var zye = Math.ceil(ts/pcount);
	return zye;
}