手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >Javascript表格翻页效果的具体实现
Javascript表格翻页效果的具体实现
摘要:表格翻页的实现方式有很多,下面以js为例为大家详细介绍下表格翻页效果的具体实现。复制代码代码如下:表格翻页---www.jb51.netbo...

表格翻页的实现方式有很多,下面以js为例为大家详细介绍下表格翻页效果的具体实现。

复制代码 代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE>表格翻页---www.jb51.net</TITLE>

<style>

body, td{

font-size: 9pt;

}

a:link {

color: #FF0000;

}

a:visited {

color: #FF0000;

}

a:hover {

color: #006600;

}

</style>

<SCRIPT LANGUAGE="JavaScript">

<;

coordinatePagenum(pagenum);

showhiddenRecord(pagenum);

}

function nextPage(){

pagenum++;

coordinatePagenum(pagenum);

showhiddenRecord(pagenum);

}

function gotoPage(num){

coordinatePagenum(pagenum);

showhiddenRecord(num);

}

//-->

</SCRIPT>

</HEAD>

<BODY onLoad="showhiddenRecord(pagenum)">

<center>

共 6 页 当前第 <span id="number">1</span> 页

<span id="theFirstPage"><a href="javascript:firstPage()">第一页</a></span>

<span id="thePrePage"><a href="javascript:prePage()">上一页</a></span>

<span id="theNextPage"><a href="javascript:nextPage()">下一页</a></span>

<span id="theLastPage"><a href="javascript:lastPage()">最后一页</a></span>

转到第<select onChange="gotoPage(this.value)" name="goto">

<option value=1>1</option>

<option value=2>2</option>

<option value=3>3</option>

<option value=4>4</option>

<option value=5>5</option>

<option value=6>6</option>

</select>页

</center>

<TABLE id="mytable" cellpadding=4 cellspacing=1 border=0 bgcolor=#999999 width=500 align=center>

<TR bgcolor=#ffffff><TD>标题</TD></TR>

<TR bgcolor=#ffffff><TD>1</TD></TR>

<TR bgcolor=#ffffff><TD>2</TD></TR>

<TR bgcolor=#ffffff><TD>3</TD></TR>

<TR bgcolor=#ffffff><TD>4</TD></TR>

<TR bgcolor=#ffffff><TD>5</TD></TR>

<TR bgcolor=#ffffff><TD>6</TD></TR>

<TR bgcolor=#ffffff><TD>7</TD></TR>

<TR bgcolor=#ffffff><TD>8</TD></TR>

<TR bgcolor=#ffffff><TD>9</TD></TR>

<TR bgcolor=#ffffff><TD>10</TD></TR>

<TR bgcolor=#ffffff><TD>11</TD></TR>

<TR bgcolor=#ffffff><TD>12</TD></TR>

<TR bgcolor=#ffffff><TD>13</TD></TR>

<TR bgcolor=#ffffff><TD>14</TD></TR>

<TR bgcolor=#ffffff><TD>15</TD></TR>

<TR bgcolor=#ffffff><TD>16</TD></TR>

<TR bgcolor=#ffffff><TD>17</TD></TR>

<TR bgcolor=#ffffff><TD>18</TD></TR>

<TR bgcolor=#ffffff><TD>19</TD></TR>

<TR bgcolor=#ffffff><TD>20</TD></TR>

<TR bgcolor=#ffffff><TD>21</TD></TR>

<TR bgcolor=#ffffff><TD>22</TD></TR>

<TR bgcolor=#ffffff><TD>23</TD></TR>

<TR bgcolor=#ffffff><TD>24</TD></TR>

</TABLE>

</BODY>

</HTML>

【Javascript表格翻页效果的具体实现】相关文章:

JavaScript深度复制(deep clone)的实现方法

javascript用函数实现对象的方法

Javascript类型转换的规则实例解析

javascript搜索框效果实现方法

javascript操作表格

简述JavaScript中正则表达式的使用方法

JavaScript 预解析的原理及实现

JavaScript实现鼠标点击后层展开效果的方法

JavaScript的9种继承实现方式归纳

Javascript 不能释放内存.

精品推荐
分类导航