ajax实现无刷新分页

1.我们为什么要使用ajax

2. 什么是ajax

ajax的作用

 我们在使用ajax时需要导入的jar包

 

 接下来是代码展示

$(function(){
	//默认显示第一页
	myf('a');
})
//专门控制分页的方法
var pageIndex;
var max;
function myf(type){
	//拿到文本框的值
	var gname=$("#gname").val();
	if(type=='a'){	
		//首页
		pageIndex=1;
	}
	else if(type=='b'){
		//上一页
		if(pageIndex>1){
			pageIndex--;
		}else{
			alert("已经没有更前面的啦");
		}
		
	}
	else if(type=='c'){
		//下一页
		if(pageIndex<max){
			pageIndex++;
		}else {
			alert("已经是最后一页了")
		}
		
	}else {
		//末页
		pageIndex=max;
	}
	$.post("page.do",{pid:pageIndex,gname:gname},function(data){
		//根据属性拿到属性值 或者说根据键拿到值
		//alert(data.pageMax);//数据类型  String 
		//alert(data.goodsList);
		//把json格式的字符串解析成js的对象数组 
		//var ss =$.parseJSON(data);
		//alert($.type(ss));//array数组
		max =data.pageMax;
		var sb ="<table border=\"1px\" width=\"60%\">";
		 sb+="<tr align=\"center\">";
		sb+="<td>商品序号</td>";
		sb+="<td>商品名称</td>";	
		sb+="<td>商品图片</td>";		
	sb+="</tr>";
		$.each(data.goodsList,function(i, g){//下标，元素 商品
			sb+="<tr>";
			sb+="<td>"+g.gid+"</td>";
			sb+="<td>"+g.gname+"</td>";		
			sb+="<td><img src ='"+g.gpath+"'/></td>";
			sb+="</tr>";
		})
		sb+="</table>";
		//给div赋值
		$("#aa").html(sb);  
		//赋值当前页码和最大页码
		$("#xx").html(pageIndex);
		$("#yy").html(max);
	},"json")
}