在每行之后将div添加到表中

Question

我有这张桌子：https://codepen.io/anon/pen/bjvwOx 每次我点击一行（例如第一行“ NODE ID 1”）时，ID为#divTemplate的div就会出现在该行的下方，如在演示链接中所见。

问题是（我知道）：

1. div会显示endpointsData对象的所有内容（例如，如果我单击第一行， div中应包含“ EPID：1”，而不是“ EPID：1234”（如演示中所示）。

2. div的“手风琴”显示混乱。在演示中，您可以查看是否按 div连续多次出现，只是在不同的位置出现，直到不再起作用

对于第一个问题，我做到了：https://codepen.io/anon/pen/Owvbae（我从div中选择了每个ID）

$("#epid").text(roomValue[key[0]]);
$("#clslist").text(roomValue[key[1]]);
$("#type").text(roomValue[key[2]]);
$("#zplus").text(roomValue[key[3]]);

有没有办法让我循环播放？ 对第二个问题有什么想法吗？

Answer 1

要修复“手风琴”，应将其放入<tr class="header">中，然后使用jquery并在按下时进行监听。

$('.header').on('click' function() {
// code
});

之后，使用$('this')获取被按下的内容，并将其定位在子行.children([selector])上以操纵该手风琴。