jquery table 增加两行,删除两行,并且有跨行rowspan
table 每次同时增加两行或同时删除两行, 并且此两行间有跨行rowspan.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>3-5-2</title>
<!-- 引入jQuery -->
<script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
</head>
<body>
<input type="button" class="button" onclick="addTable()" value="增加">
<table id="table1" cellpadding="1" cellspacing="1" border="1" width="500" >
<tr>
<th width="30%" >
操作
</th>
<th width="40%">
文件名称
</th>
<th width="30%">
上传时间
</th>
</tr>
<tr id='tr1'>
<td rowspan="2" >
<input type="button" onclick="deleteTable0(this)" value="删除" >
<span id="ss">a</span>
</td>
<td>
文件名称1111
</td>
<td>
11111111
</td>
</tr>
<tr id='tr2'>
<td >
文件名称2222
</td>
<td >
222222
</td>
</tr>
<tr id='trbefore'>
<td >
aaaaaaaaaaaa
</td>
<td >
aaaaaaaaaaaaa
</td>
<td >
aaaaaaaaaa
</td>
</tr>
</table>
<script language="JavaScript">
var $tr1 = $("#tr1").remove();
var $tr2 = $("#tr2").remove();
var i=0;
//增加两行
function addTable() {
i++;
$("#trbefore").before($tr1.clone().find("#ss").html("文件"+i).end());
$("#trbefore").before($tr2.clone());
}
function deleteTable0(obj) {
i--;
//先删除当前行的下面的一行
$(obj.parentNode.parentNode).next().remove();
//然后再删除当前行
$(obj.parentNode.parentNode).remove();
}
</script>
</body>
</html> 相关推荐
SCNUHB 2020-11-10
FellowYourHeart 2020-10-05
思君夜未眠 2020-09-04
jessieHJ 2020-08-19
行吟阁 2020-08-09
表格的现在还是较为常用的一种标签，但不是用来布局，常见处理、显示表格式数据。在HTML网页中，要想创建表格，就需要使用表格相关的标签。<table> <tr> <td>单元格内的文字</td> ...
gufudhn 2020-08-09
末点 2020-08-03
nimeijian 2020-07-30
好记忆也需烂 2020-07-28
zlsdmx 2020-07-05
tomson 2020-07-05
tianqi 2020-07-05
onlykg 2020-07-04