javascript+ajax的分页处理

用javascript写分页代码的时候，由于无法像php一样使用$_GET[]函数获取连接中附带的值（例如：<a href='a.php?name='.$name.'>'）而又要实现不同页面参数的传递，所以，需要利用javascript中的window.location.toString()函数，它的作用是获取当前浏览器中地址栏中的地址，然后利用split("?")函数将地址按？截断为两部分，并将结果保存在一个数组中，接着利用parseInt（ob,int)将ob转换为数字，这时要注意，链接中传递的参数应该只能是数字，这样利用parseInt函数转换的时候才有意义。像<a href='a.php?page=1'>

 

实现分页功能的基本思路：
1.连接到数据库， 并且依据sql语句取得了查询结果

2.需要设定几个值：

 

              var amount=yan.length;	//总记录数
	var page_size=16;	//每页记录数
	var pages;	//总页数
	var page=1;	//当前页码
	var inta=0;	//每一次查询的起始位置
              var b;            //设定查询的终止位置

 

3.每一次加载页面的时候都要获取page的值，依据page的值来改变页面的显示结果

 

var str=window.location.toString();
	if (str.indexOf("?")==-1)
	{
		str=str+"?1"
	}
	r=str.split("?")
	page=parseInt(r[1],10);

 

4.进行逻辑判断

 

if(amount==0){
		document.getElementById("res").innerHTML="要查询的信息不存在";
	}

  else{

 

if (amount<page_size)
		{
			pages=1;
		}
		else{
		 if (amount%page_size==0)
			{
				pages=(amount/page_size);
			}	
		 else
			{
				pages=(parseInt)(amount/page_size)+1;
			}
		}
		if (page>=pages)
		{
			inta=(pages-1)*page_size;	//到了尾页不应该继续往下翻,显示的始终是最后一页的页面
			b=amount        
		}
		else
		{
			inta=(page-1)*page_size;
			b=page*page_size;
		}

 

 4.设定好了这些逻辑参数以后就可以进行输出显示了

for(var i=inta;i<b;i++)
		{
			var y=yan[i];
			ta+="<tr bgcolor='#e5e5e5'><td><span style='font-size:15;color:blue'>"+y.childNodes[0].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[1].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[2].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[3].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[4].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[5].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[6].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[7].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[8].firstChild.data+"</span></td>";
			ta+="<td><span style='font-size:14'>"+y.childNodes[9].firstChild.data+"</span></td></tr>";
		}

 

5.下面的就是分页连接了

if (page==1)
		{
			page_string+='第一页|上一页';
		}
		else
		{
			page_string+='<a href=?1>第一页</a>|<a href=?'+(parseInt)(page-1)+'>上一页</a>|';
		}
		if (page==pages)
		{
			page_string+='下一页|尾页';
		}
		else
		{
			page_string+='<a href=?'+(page+1)+'>下一页</a>|<a href=?'+pages+'>尾页</a>';
		}

ta+=page_string;
document.getElementById("res").innerHTML=ta;

 

分页链接通过改变并提交page的值后，影响循环语句中的起始位置和最终位置，来改变页面显示的数据。

虽然语法有区别，但分页的思路同其他语言也是一样的。