二级联动,获取一级是table的tr数据,改变二级table数据 具体代码
时间: 2024-02-27 13:52:31 浏览: 111
您的问题不是很明确,不过我猜您可能是指在一个表格中,点击某一行的时候,根据这一行的数据,来更新另一个表格的数据,是吗?如果是的话,大概的思路如下:
1. 给第一个表格的每一行绑定一个点击事件。
2. 当用户点击某一行的时候,获取该行的数据。
3. 根据该行的数据,动态生成第二个表格的数据。
4. 将第二个表格的数据更新到页面上。
下面是一个简单的示例代码,希望能够帮到您:
HTML:
```
<table id="table1">
<thead>
<tr>
<th>一级表格的标题1</th>
<th>一级表格的标题2</th>
</tr>
</thead>
<tbody>
<tr>
<td>一级表格的数据1</td>
<td>一级表格的数据2</td>
</tr>
<tr>
<td>一级表格的数据3</td>
<td>一级表格的数据4</td>
</tr>
</tbody>
</table>
<table id="table2">
<thead>
<tr>
<th>二级表格的标题1</th>
<th>二级表格的标题2</th>
</tr>
</thead>
<tbody>
<!-- 这里是动态生成的 -->
</tbody>
</table>
```
JS:
```
$(document).ready(function() {
// 给第一个表格的每一行绑定点击事件
$('#table1 tbody tr').click(function() {
// 获取该行的数据
var data1 = $(this).find('td:eq(0)').text();
var data2 = $(this).find('td:eq(1)').text();
// 根据该行的数据,动态生成第二个表格的数据
var html = '';
for (var i = 0; i < 5; i++) { // 这里假设需要生成5行数据
html += '<tr>';
html += '<td>' + data1 + i + '</td>'; // 这里根据需要生成不同的数据
html += '<td>' + data2 + i + '</td>';
html += '</tr>';
}
// 将第二个表格的数据更新到页面上
$('#table2 tbody').html(html);
});
});
```
这只是一个简单的示例,具体的实现方式可能根据您的需求有所不同。
阅读全文