C#下想实现TABLE行的显示和隐藏

mingrui99 2013-10-17 12:56:14

现在开发的项目，需要做新增一些行项目的操作，比如三行两列的一个TABLE，默认前台只显示一行即可，其它行隐藏，当需要时，点击“增加”按扭，每点击一次，增加一行。同样点击“减少”按钮，点击一次减少一行。
各位大虾帮个忙，谢谢了

...全文

406 1 打赏收藏转发到动态举报

写回复

用AI写文章

1 条回复

切换为时间正序

请发表友善的回复…

发表回复

asdf147asdf 2013-10-17

打赏
举报


<!doctype html>
<html>
<head>
<meta charset="gb2312">
<title>无标题文档</title>
<script type="text/javascript" src="jquery1.7.js"></script>
<script type="text/javascript">

$(document).ready(function(e) {
	$("#table1 tr:gt(1)").hide()
	
	$("#add").click(function(e) {
		i=$("#table1 tr:visible").length
		$("#table1 tr:eq("+i+")").show()
    });
	$("#del").click(function(e) {
		i=$("#table1 tr:visible").length-1
		$("#table1 tr:eq("+i+")").hide()
    });
});


</script>

</head>

<body>
<table width="400" border="1" align="center" id="table1">
  <tr>
    <td>a</td>
    <td>b</td>
    <td>c</td>
  </tr>
  <tr>
    <td>1</td>
    <td>1</td>
    <td>1</td>
  </tr>
  <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>
  </tr>
  <tr>
    <td>3</td>
    <td>3</td>
    <td>3</td>
  </tr>
  <tr>
    <td>4</td>
    <td>4</td>
    <td>4</td>
  </tr>
  <tr>
    <td>5</td>
    <td>5</td>
    <td>5</td>
  </tr>
</table>
<input name="add" type="button" id="add" value="增加"><input name="del" type="button" id="del" value="减少">
</body>
</html>