js部分
var head_str = "";
var maxpage = 0; //最大页数var jls00 = 0; //记录数
$(function () {
$("#pageIndex").val(pageIndex);
$("#tt").text(maxpage);
head();
getData();
});
//刷新
function sx() {
$("#pageIndex").val(pageIndex);
$("#tt").text(maxpage);
$("#count").html(jls00);
head_str = "";
head();
getData();
}
//头部
function head() {
var strtb = "2[]单号[]区域[]经办人[]编号[]";
strtb = strtb.substr(strtb.indexOf("[]") + parseInt(2));
var arrystrtb = strtb.split('[]');
head_str += "<tbody><tr>";
for (var i = 0; i < arrystrtb.length - 1; i++) {
var text = $("#text_" + parseInt(parseInt(i) + 1)).val();
text = parseInt(text);
head_str += "<th rindex ='" + (i + 1) + "' width='" + text + "mm'>" + arrystrtb[i] + "</th>";
}
head_str += "</tr></tbody>";
$("#Rtablesub").html(head_str);
}
//内容
var data = "10[]C0001[]电容[]SYSTEM[]69023[]COOO2[]继电器[]吴 R[]23038[]COOO3[]继电器3[]吴 R3[]230383[]COOO4[]继电器4[]吴 R4[]230384[]COOO5[]继电器4[]吴 R4[]230384[]COOO6[]继电器4[]吴 R4[]230384[]COOO7[]继电器4[]吴 R4[]230384[]COOO8[]继电器4[]吴 R4[]230384[]COOO9[]继电器4[]吴 R4[]230384[]COOO10[]继电器4[]吴 R4[]230384[]";
jls00 = data.substr(0, data.indexOf("[]"));
jls00 = parseInt(jls00);
data = data.substr(data.indexOf("[]") + parseInt(2));
var arrystr = data.split('[]');
var number = (arrystr.length - 1) / jls00;
var pageIndex = 1; //当前页
var pageSize = 4; //页容量
maxpage = Math.ceil(jls00 / pageSize);
function getData() {
$("#Rtablesub").html(head_str);
html = "";
var end = pageIndex * pageSize < jls00 ? pageIndex * pageSize : jls00;
for (var i = (pageIndex - 1) * pageSize; i < end; i++) {
html += "<tr rid='" + i + "'>";
for (var j = 0; j < number; j++) {
html += "<td>" + arrystr[i * number + j] + "</td>";
}
html += "</tr>";
}
$("#Rtablesub").append(html);
}
//下一页
function next() {
pageIndex++;
if (pageIndex > maxpage) {
pageIndex = 1;
}
$("#pageIndex").val(pageIndex);
getData();
}
//上一页
function back() {
pageIndex--;
if (pageIndex < 1) {
pageIndex = maxpage;
}
$("#pageIndex").val(pageIndex);
getData();
}
//首页
function first() {
pageIndex = 1;
$("#pageIndex").val(pageIndex);
getData();
}
//末页
function last() {
pageIndex = maxpage;
$("#pageIndex").val(pageIndex);
getData();
}
页面:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="css/index.css" rel="stylesheet" type="text/css" />
<script src="js/Jquery1.7.js" type="text/javascript"></script>
<script src="js/common.js" type="text/javascript"></script>
<script src="js/fy.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<input type="hidden" id="pageIndex" />
单号:<input type="text" id="text_1" value="66" /><br />
区域:<input type="text" id="text_2" / value="55"><br />
经办人:<input type="text" id="text_3" value="77"/><br />
编号:<input type="text" id="text_4" value="99"/><br />
<input type="button" value="刷新" οnclick="sx();"/>
<br />
<div id="Rtable">
<div class="p">
<table border="0" cellspacing="0" class="table" id="Rtablesub">
</table>
</div>
</div>
<div class="pages">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="ta-right">
共<a id="count" href="javascript:void(0)"></a>条
共<a id="tt" href="javascript:void(0)"></a>页
<a id="firstPage" href="javascript:void(0)" οnclick="first()">首页</a>
<a id="prevPage" href="javascript:void(0)" οnclick="back()">上页</a>
<a id="nextPage" href="javascript:void(0)" οnclick="next()">下页</a>
<a id="lastPage" href="javascript:void(0)" οnclick="last()">末页</a>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>