Question

我有两张桌子：

<table width="200" id="table1" border=1 style="float:left;">
<tr><th>Subject</th><th>Hour</th></tr>
<tr class="head"><td colspan=2>MONDAY</td></tr>
<tr><td>English</td><td>3pm</td></tr>
<tr><td>Spanish</td><td>4pm</td></tr>
<tr class="head"><td colspan=2>TUESDAY</td></tr>
<tr><td>Italian</td><td>1pm</td></tr>
<tr><td>French</td><td>2pm</td></tr>
<tr class="head"><td colspan=2>WEDNESDAY</td></tr>
<tr><td>Japanese</td><td>10pm</td></tr>
</table>
<table width="200" id="table2" border=1 style="float:left;">
<tr><th>Users</th></tr>
<tr class="second"><td>User1</td></tr>
<tr class="second"><td>User2</td></tr>
<tr class="second"><td>User3</td></tr>
<tr class="second"><td>User4</td></tr>
<tr class="second"><td>User5</td></tr>
</table>

我想要实现的是，对于表1中的每个头类，我想插入空白表行，因此表2中的用户将匹配正确的主题（而不是日期名称），因此它将是User1是与English，User1 - ＆gt;相同的行Spanish ......等等。

注意：如果你问为什么这些表看起来像这样，那是因为它们是从另一个页面动态加载的，我只能用jquery / javascript设置一些id属性到td，tr或table等。示例准备好进入JSFiddle

编辑：我想在表2中插入空行，所以它们看起来都一样。这是我希望实现的结果的链接LINK

Answer 1

<强> Demo

我明白了，你有两个相邻的桌子，右边需要一个空格来清除“头”行

// edited to cope with hidden trs in table 1
var emptytr=$('<tr><td>&nbsp;</td></tr>');
$('#table1 tr:visible').each(function(i){
    if ($(this).hasClass('head')){ 
        emptytr.clone().insertAfter('#table2 tr:eq('+(i-1)+')');
    }
});

这不是显示表格结果的好方法，因为它们很容易变得不对齐。正确的方法是将两者结合起来，最好是在它们存在于浏览器之前。但是，你已经说过你不能在浏览器上执行此操作，因为它们是动态加载的，但我个人仍然坚持能够识别每个数据项属于哪一行并使整个事物成为一个表。

jquery在其他表行之间插入表行

1 个答案: