<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>
<script language="javascript" src="jquery-1.10.2.js"></script>
<script language="javascript">
$(document).ready(function()
{
var k=$("#table1 tbody tr").length;
var rowevery=2;
var k1=Math.ceil(k/rowevery);
alert(k1);
});
</script>
<body>
<table id="table1" border="2" width="500" >
<thead>
<tr>
<td >學號</td>
<td >姓名</td>
<td >國文</td>
<td >英文</td>
<td >數學</td>
</tr>
</thead>
<tbody>
<tr>
<td >p1001</td>
<td >張三</td>
<td >80</td>
<td >40</td>
<td >89</td>
</tr>
<tr>
<td >p1002</td>
<td >小禮</td>
<td >81</td>
<td >87</td>
<td >69</td>
</tr>
<tr>
<td >p1003</td>
<td >小美</td>
<td >84</td>
<td >98</td>
<td >100</td>
</tr>
<tr>
<td >p1004</td>
<td >徐立</td>
<td >86</td>
<td >5O</td>
<td >78</td>
</tr>
<tr>
<td >p1005</td>
<td >徐立</td>
<td >86</td>
<td >5O</td>
<td >78</td>
</tr>
</tbody>
</table>
</body>
</html>
==========================
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>
<script language="javascript" src="jquery-1.10.2.js"></script>
<script language="javascript">
$(document).ready(function()
{
var k=$("#table1 tbody tr").length;
var rowevery=2;
var k1=Math.ceil(k/rowevery);
//alert(k1);
for (var i=1;i<=k1;i++)
{
$("#nav").append("<a class='ap' href='javascript:void' id='a'"+i+">"+i+"</a>");
}
$(".ap").click(function()
{
var p=$(this).text();
alert(p);
});
});
</script>
<body>
<table id="table1" border="2" width="500" >
<thead>
<tr>
<td >學號</td>
<td >姓名</td>
<td >國文</td>
<td >英文</td>
<td >數學</td>
</tr>
</thead>
<tbody>
<tr>
<td >p1001</td>
<td >張三</td>
<td >80</td>
<td >40</td>
<td >89</td>
</tr>
<tr>
<td >p1002</td>
<td >小禮</td>
<td >81</td>
<td >87</td>
<td >69</td>
</tr>
<tr>
<td >p1003</td>
<td >小美</td>
<td >84</td>
<td >98</td>
<td >100</td>
</tr>
<tr>
<td >p1004</td>
<td >徐立</td>
<td >86</td>
<td >5O</td>
<td >78</td>
</tr>
<tr>
<td >p1005</td>
<td >徐立</td>
<td >86</td>
<td >5O</td>
<td >78</td>
</tr>
</tbody>
</table>
<p>
<div id="nav" style=" background-color:#0FF; width:500px; height:20px"></div>
</body>
</html>
=================
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>
<script language="javascript" src="jquery-1.10.2.js"></script>
<script language="javascript">
$(document).ready(function()
{
var k=$("#table1 tbody tr").length;
var rowevery=2;
var k1=Math.ceil(k/rowevery);
//alert(k1);
for (var i=1;i<=k1;i++)
{
$("#nav").append("<a class='ap' href='javascript:void' id='a'"+i+">"+i+"</a>");
}
hidefun("s");
$(".ap").click(function()
{
var p=$(this).text();
//alert(p);
hidefun("s");
var po=(p-1)*rowevery;
for (var h=po;h<rowevery+po;h++)
{
$("#table1 tbody tr:eq("+h+")").show();
}
});
function hidefun(re)
{
for (var j=0;j<k;j++)
{
$("#table1 tbody tr:eq("+j+")").hide();
}
}
});
</script>
<body>
<table id="table1" border="2" width="500" >
<thead>
<tr>
<td >學號</td>
<td >姓名</td>
<td >國文</td>
<td >英文</td>
<td >數學</td>
</tr>
</thead>
<tbody>
<tr>
<td >p1001</td>
<td >張三</td>
<td >80</td>
<td >40</td>
<td >89</td>
</tr>
<tr>
<td >p1002</td>
<td >小禮</td>
<td >81</td>
<td >87</td>
<td >69</td>
</tr>
<tr>
<td >p1003</td>
<td >小美</td>
<td >84</td>
<td >98</td>
<td >100</td>
</tr>
<tr>
<td >p1004</td>
<td >徐立</td>
<td >86</td>
<td >5O</td>
<td >78</td>
</tr>
<tr>
<td >p1005</td>
<td >徐立</td>
<td >86</td>
<td >5O</td>
<td >78</td>
</tr>
</tbody>
</table>
<p>
<div id="nav" style=" background-color:#0FF; width:500px; height:20px"></div>
</body>
</html>
==========================
沒有留言:
張貼留言