<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>归纳</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<script type="text/javascript">
var iset = {1:1,2:2,3:3};
function merg() {
// 合并行
for(k in iset){
var trs = $('tr[lb_id='+k+']');
var length = trs.length;
$.each(trs,function (i,n) {
if(i == 0){
$(n).children(':eq(0)').attr('rowspan',length);
}else{
$(n).children(':eq(0)').remove();
}
});
}
// 增加序号
var tds = $("td[rowspan]");
$.each(tds,function (i,n) {
var oldText = $(n).text();
$(n).text((i+1) + '.' + oldText);
})
// 销毁button
$('button').remove();
}
</script>
</head>
<body>
<table border="1">
<tr>
<th>类别</th>
<th>举例</th>
</tr>
<tr lb_id="1">
<td>字母</td>
<td>A</td>
</tr>
<tr lb_id="1">
<td>字母</td>
<td>B</td>
</tr>
<tr lb_id="1">
<td>字母</td>
<td>C</td>
</tr>
<tr lb_id="1">
<td>字母</td>
<td>D</td>
</tr>
<tr lb_id="1">
<td>字母</td>
<td>E</td>
</tr>
<tr lb_id="2">
<td>数字</td>
<td>1</td>
</tr>
<tr lb_id="2">
<td>数字</td>
<td>2</td>
</tr>
<tr lb_id="2">
<td>数字</td>
<td>3</td>
</tr>
<tr lb_id="3">
<td>符号</td>
<td>#</td>
</tr>
<tr lb_id="3">
<td>符号</td>
<td>*</td>
</tr>
</table>
<button style="color: red;position: relative;top: 20px;" onclick="merg()">点击合并表格</button>
</body>
</html>
| 类别 | 举例 |
|---|
| 字母 |
A |
| 字母 |
B |
| 字母 |
C |
| 字母 |
D |
| 字母 |
E |
| 数字 |
1 |
| 数字 |
2 |
| 数字 |
3 |
| 符号 |
# |
| 符号 |
* |
| 类别 | 举例 |
|---|
| 1.字母 |
A |
| B |
| C |
| D |
| E |
| 2.数字 |
1 |
| 2 |
| 3 |
| 3.符号 |
# |
| * |