您的位置:首页 > 其它

ajax 分页最终版(1)分页函数

2010-10-01 14:44 281 查看
Code:

/*

* 分页函数

* page 请求的页面

* rows 每页记录数

* queryStr 被查找的字符串

* colStr 被查找的字段,为空则查找所有的字段

* who 分页的对象,就是struts-config.xml 配置的path(无'/')

* return tbody里的数据,以及对这些数据操作的功能,最后一定要加上(return ;),否则会重复的调用getDate()方法

*/



function getDate(page,rows,queryStr,colStr,who){

if(who=="" || who=="undefined"){

alert("请在参数中添加要查找的对象名称");

return ;

}

//请求数据的地址

var url="../"+who+".do?page="+page+"&rows="+rows;

if(queryStr!="" || queryStr!="undefined")

url=url+"&queryStr="+queryStr;

if(colStr!="" || colStr!="undefined")

url=url+"&colStr="+colStr;

//将地址统一转成ISO,在服务端在统一转回UTF-8(汉字在不同浏览器中编码不同,若不统一编码地址,则在服务器无法解析多种编码同时共存的情况)

url=encodeURI(url);

//ajax前,使背景变灰等待,阻止用户进一步操作

$(".mask").css("display","block").css("width","100%").css("height","100%");

$(".mask-msg").css("display","block").css("top","49%").css("left","44%");



$.post(url,null,function(date){

var objs=eval(date);

if(objs=="") {

$("#tDate").append("<tr><td colspan=7>没有记录~</td></tr>");

total=0;

return ;

}

$("#tDate tr").remove();

//表的第一列显示行号

var lineNum=1;

//表的第一列显示背景色为标题栏颜色

var lineCSS=0;

//得到thead th 中定义的所有tName,用户获取json数据,为obj对象的下标

var tName=gettNames();

for(var i in objs){

var obj=objs[i];

//存储每行的信息

var outPut="";

//隔行换色

if(lineNum%2==0)

outPut+="<tr class=alt><td>"+lineNum+"</td>"

else

outPut+="<tr><td>"+lineNum+"</td>"

//由tName作为下标获取obj中的json数据存储到各数据列中

for(var t=0;t<tName.length;t=t+1){

outPut+="<td>"+obj[tName[t]]+"</td>";

}

//定义操作,此处可能对函数的兼容性有破坏性

outPut+="<td><div align=center><a href=# onclick=openWin('../"+who+".do?command=updateDetail&num="+obj[tName[0]]+"','updateReport',500,300);>详细</a>"

+" <a href=# onclick=del('../"+who+".do?command=del"+who+"&num="+obj[tName[0]]+"');>删除</a>"

+" <a href=# onclick=openWin('../"+who+".do?command=updateInput&num="+obj[tName[0]]+"','update"+who+"',500,300);>修改</a></div></td></tr>";

$("#tDate").append(outPut);



//取得有json传递的总记录数,此obj.total将改变index.jsp页面上的变量total的值

if(lineNum==1)

total=obj.total;

//首列标题色

$("tbody tr td:eq("+lineCSS+")").css("background","#F3F3F3").css("text-align","center");

//行数自曾

lineNum=lineNum+1;

//跳到下一行的首列

lineCSS=lineCSS+tName.length+2;

}



$("#tDate tr:odd").mouseover(function(){

$(this).removeClass("alt");

$(this).addClass("over");

}).click(function(){

$(this).removeClass("alt");

if($(this).attr("class").indexOf("beClick")==-1){

$(this).addClass("beClick");

}else{

$(this).removeClass("beClick");

$(this).addClass("alt");

}

});

$("#tDate tr:odd").mouseout(function(){

if($(this).attr("class").indexOf("beClick")==-1){

$(this).removeClass("over");

$(this).addClass("alt");

}

});



$("#tDate tr:even").mouseover(function(){

$(this).addClass("over");

}).click(function(){

if($(this).attr("class").indexOf("over")!=-1)

$(this).removeClass("over");

if($(this).attr("class")=="beClick")

$(this).removeClass("beClick");

else

$(this).addClass("beClick");

});

$("#tDate tr:even").mouseout(function(){

$(this).removeClass("over");

});



//总页数

if(total%rows==0)

totalPage=parseInt(total/rows);

else

totalPage=parseInt(total/rows)+1;



//设置index.jsp页面相应地点的值

$("#pageNum").val(page);

$("#fromNum").html((page-1)*rows);

$("#toNum").html(page*rows);

$("#totalNum").html(total);

$("#totalPage").html(totalPage);

$(".mask").css("display","none");

$(".mask-msg").css("display","none");

});

//(重要!)否则当点击下一页或上一页按钮时,页面会级数的执行,由1-2-4-8

return ;

}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: