由于,jquery 中的append 对ie 不兼容
最后分页写成这样:
js部分:
function getJSONData(pn,pageSize) {
alert("getJSONData>pn:"+pn+" pageSize:"+pageSize);
var startRecord =pageSize * (pn - 1);
$.getJSON($("#servlet").val()+"?action=getsAjax&startRecord="+startRecord+"&pageSize="+pageSize, function(data) {
var totalCount = data.totalCount; // 总记录数
var returnCount = data.returnCount; // 返回记录数
var pageTotal = Math.ceil(totalCount / pageSize); // 总页数
alert("总记录数:"+totalCount+" 总页数:"+pageTotal+" 当前开始记录起点:"+startRecord+"每页规定记录数:"+pageSize+"实际返回记录数:"+returnCount);
// alert("未重新设置前:total-page:"+document.getElementById("total-page").innerText
// +" totalCount:"+document.getElementById("totalCount").innerText);
// document.getElementById("total-page").innerHTML=pageTotal;
// document.getElementById("totalCount").innerHTML=totalCount;
// alert("重新设置后:total-page:"+document.getElementById("total-page").innerText
// +"totalCount:"+document.getElementById("totalCount").innerText);
alert("未重新设置前:total-page:"+$("#total-page").text()
+" totalCount:"+$("#totalCount").text());
$("#total-page").text(pageTotal);
$("#totalCount").text(totalCount);
alert("未重新设置后:total-page:"+$("#total-page").text()
+" totalCount:"+$("#totalCount").text());
var dataRoot = data.jsonRoot;
var table=document.getElementById("list");
alert("表单长度:"+table.rows.length);
for (var i=table.rows.length-1;i>0;i--) {
table.deleteRow(i);
}
var content="";
for (var j = 0; j <pageSize; j++) {
var tr=table.insertRow();
if(j<returnCount){
tr.insertCell().innerHTML=dataRoot[j].c_no+" ";
tr.insertCell().innerHTML=dataRoot[j].c_comp+" ";
tr.insertCell().innerHTML=dataRoot[j].name+" ";
tr.insertCell().innerHTML=dataRoot[j].e_name+" ";
tr.insertCell().innerHTML="<a href='"+$("#servlet").val()+"?action=uptPre&sid="+dataRoot[j].c_no
+"'>修改</a> <a href='"+$("#servlet").val()+"?action=del&sid="+dataRoot[j].c_no+"'>删除</a>";
}else{
tr.insertCell().innerHTML=" ";
tr.insertCell().innerHTML=" ";
tr.insertCell().innerHTML=" ";
tr.insertCell().innerHTML=" ";
tr.insertCell().innerHTML=" ";
}
}
// $("#total-page").text(pageTotal);//jquery写法,不兼容ie6,7,8
// $("#totalCount").text(totalCount);
// var tr=$("table:first tbody").children("tr:gt(0)");
// tr.remove();
// var content="";
// for (var j = 0; j <pageSize; j++) {
var currentNode=$("table:first tbody tr:eq("+j+")");
alert(currentNode);
// if(j<returnCount){
// content +="<tr><td>"+dataRoot[j].c_no+"</td>";
// content +="<td>"+dataRoot[j].c_comp+"</td>";
// content +="<td>"+dataRoot[j].name+"</td>";
// content +="<td>"+dataRoot[j].e_name+"</td>";
// content +="<td><a href='"+$("#servlet").val()+"?action=uptPre&sid="+dataRoot[j].c_no
// +"'>修改</a> <a href='"+$("#servlet").val()+"?action=del&sid="+dataRoot[j].c_no+"'>删除</a></td></tr>";
// alert(content);
// }else{
// content +="<tr><td> </td><td> </td><td> </td><td> </td><td> </td></tr>";
// }
currentNode.after(content);
// }
// alert(content);
// $("#list tbody").append(content);
})
}
function getPage() {
pn = 1;
$("#next").click(function() {
pn=parseInt($("#current-page").text());
var totalCount = parseInt($("#totalCount").text()); // 总记录数
var pageSize = $("#pageSize").val(); // 每页显示几条记录
var pageTotal = Math.ceil(totalCount / pageSize); // 总页数
if (pn != pageTotal) {
gotoPage(++pn,pageSize);
}
});
$("#prev").click(function() {
pn=parseInt($("#current-page").text());
var totalCount = parseInt($("#totalCount").text()); // 总记录数
var pageSize = $("#pageSize").val(); // 每页显示几条记录
var pageTotal = Math.ceil(totalCount / pageSize); // 总页数
if (pn != 1) {
gotoPage(--pn,pageSize);
}
})
$("#firstPage").click(function() {
pn = 1;
var pageSize = $("#pageSize").val(); // 每页显示几条记录
gotoPage(pn,pageSize);
});
$("#lastPage").click(function() {
pn=parseInt($("#current-page").text());
var totalCount = parseInt($("#totalCount").text()); // 总记录数
var pageSize = $("#pageSize").val(); // 每页显示几条记录
var pageTotal = Math.ceil(totalCount / pageSize); // 总页数
alert("点击最后一页>current-page: "+parseInt($("#current-page").text())+" pageTotal: "+pageTotal);
if(pn!=pageTotal)
{
pn = pageTotal;
gotoPage(pn,pageSize);
}
});
$("#page-jump").click(function(){
pn=parseInt($("#current-page").text());
var totalCount = parseInt($("#totalCount").text()); // 总记录数
var pageSize = $("#pageSize").val(); // 每页显示几条记录
var pageTotal = Math.ceil(totalCount / pageSize); // 总页数
if($("#page-num").val() <= pageTotal && $("#page-num").val() != ''&&$("#page-num").val()>0 && $("#pageSize").val()>0){
pn = $("#page-num").val();
alert("getPage:"+pn+" pageSize: "+$("#pageSize ").val());
gotoPage(pn,pageSize);
}
})
}
function gotoPage(pn,pageSize) {
$("#current-page").text(pn);
getJSONData(pn,pageSize)
}
$(function() {
// alert($("#servlet").val()+":这是从页面传送过来的参数")
getPage();
})
在使用的页面:
<jsp:include page="../splitPage.jsp">
<jsp:param value="CustomServlet" name="servlet"/>
<jsp:param value="${totalCount}" name="totalCount"/>
<jsp:param value="${pageSize}" name="pageSize"/>
</jsp:include>
另外 表单设了id <table width="100%" border="1" id="list">