删除具有所有 td 的 tr 与边界对 mozilla 中的其他 tr 产生问题

Question

我有一个 ID 为 agenda_tbl 的 table，其格式为 ajax 响应。此 table 的行是从 while 循环创建的。

<table id="agenda_tbl">
<thead>......</thead>
<tbody>
  <tr>
     <td>Data1</td>
     <td>Data2</td>
     <td>Data3</td>
     <td>Data3</td>
     <td><input type="button" class="approve_btn"</td>
 </tr>
 <tr>
  .........
 </tr>
</table>

CSS 为上述 table

#agenda_tbl
{
margin-top:5px;
border-collapse: collapse;
font-size: 12px;
}
#agenda_tbl td
{
border:1px solid black;
padding:3px;
 }

我已经为第一个按钮编写了点击事件 page.When 我点击了按钮，我需要隐藏当前行 completely.I 已通过以下 jquery 完成此操作。

$(document).on('click','.approve_btn',function(e)
{
    var element = $(this);
    if(confirm('Do you approve this agenda?'))
    {
       element.closest('tr').remove();
    //this hides the current row.Also used hide(),made html() of row 
     //to empty.But doesnt work
    }

});

这个脚本对我来说工作正常，但相邻行的边框是 missing.I 用谷歌搜索了很多，但找不到解决方案。

屏幕截图1 单击任何行的批准按钮后，相邻行失去了边框。

Answer 1

试试这个。我知道边框更厚，但它似乎已经解决了已知的 FX 1px 行错误 - 至少在 Fx 31 中，这就是我在这里

DEMO

#agenda_tbl {
    margin-top:5px;
    border-spacing: 0; 
/* when removing the following line, 
   the lines may be thick but it works in OSX FX 40.0.3  
   even with 1px border */
    border-collapse: collapse; 
    font-size: 12px;
}
#agenda_tbl td {
    padding:3px;
    border:2px solid black;
}

删除具有所有 td 的 tr 与边界对 mozilla 中的其他 tr 产生问题

Removing a tr having all td's with border making issues to other tr in mozilla

jquery

border-layout