<html>
<style>
.button1 {background:url(pic\add.png);border:0px}
</style>
<body>
<script language="javascript" src="jquery-1.3.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("td:eq(3)",$("tr")).hide();
$('tr').find('td:eq(4)').hide();
$('tr').find('td:eq(2)').hide();
$("#button1").click(function(){
$("td:eq(3)",$("tr")).toggle(0); //设置为0表示不用动画 ，1000就1秒的时间来展示或者隐藏
$("td:eq(4)",$("tr")).toggle(0);
$("td:eq(2)",$("tr")).toggle(0);
}).toggle(
function(){
$("#button1").html('<img src="pic/del.png">');
},function(){
$("#button1").html('<img src="pic/add.png">');
}
);
});
</script>
<table id="mytable" border="1" cellpadding="0"
cellspacing="0" bordercolor="#a3b0dc" style="border-collapse:collapse;">
<tr >
<td width="200">第一列</td>
<td width="200">第二列<span id="button1"><img src="pic/add.png"></span></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>
</html>