- <body>
- <script language="javascript" src="./script/jquery.js"></script>
- <script type="text/javascript">
- $(document).ready(function(){
- $("td:eq(2)",$("tr")).hide();
- $("td:eq(3)",$("tr")).hide();
- $("td:eq(4)",$("tr")).hide();
- $("#button1").click(function(){
- $("td:eq(2)",$("tr")).toggle(1000); //设置为0表示不用动画 ,1000就1秒的时间来展示或者隐藏
- $("td:eq(3)",$("tr")).toggle(1000);
- $("td:eq(4)",$("tr")).toggle(1000);
- });
- });
- </script>
- <input type="button" id="button1" value="隐藏/显示后三列"/>
- <table id="mytable" border="1" cellpadding="0"
- cellspacing="0" bordercolor="#a3b0dc" style="border-collapse:collapse;">
- <tr >
- <td width="200">第一列</td>
- <td width="200">第二列</td>
- <td width="200">第三列</td>
- <td width="200">第四列</td>
- <td width="200">第五列</td>
- </tr>
- <tr><td>id</td><td>id1</td><td>id2</td><td>id3</td><td>id4</td></tr>
- <tr><td>id</td><td>id1</td><td>id2</td><td>id3</td><td>id4</td></tr>
- <tr><td>id</td><td>id1</td><td>id2</td><td>id3</td><td>id4</td></tr>
- <tr><td>id</td><td>id1</td><td>id2</td><td>id3</td><td>id4</td></tr>
- <tr><td>id</td><td>id1</td><td>id2</td><td>id3</td><td>id4</td></tr>
- </table>
- </body>
jquery显示隐藏列
最新推荐文章于 2024-01-16 08:55:41 发布