树视图使用嵌套表对齐问题

时间:2015-05-10 15:24:52

标签: javascript jquery html css

我需要在表格中显示分层树视图。我想在单击展开时在父表中创建一个表。子表列未正确对齐,即使我使用css提供了相同的td宽度。

在下面的图片(http://i60.tinypic.com/352qm2u.jpg)中,红色线显示了列引用,其中子tds内容必须来......但内容会分散注意力。

使用HTML

<tr class="shaded">
<td>
    <span><input type="checkbox" /></span>
</td>
<td>
    <span ><img src="></span>
</td>
<td>Q1</td><td>785-061 - SHEATH1</td><td>PUMAfinal221 products</td>
</tr>
<tr>
 <td></td>
  <td colspan="999">
    <div style="height: 180px;overflow-y: auto;">
       <table id="tblProducts185346" >
           <tbody >
             <tr >
               <td><input type="checkbox" ></td>
              <td>Q1</td><td>785-061 - SHEATH1</td><td>PUMAfinal221                         products</td>
            </tr>
          </tbody>
       </table>
    </div>
</td>
</tr>
 ...... ``

有关如何解决此问题的想法吗?

1 个答案:

答案 0 :(得分:0)

我写了一个javascript方法来根据源表td&#39;设置目标表tds的宽度。

感谢BigRabbit的回复..

&#13;
&#13;
function FormatTable(src, target) {
  var count=0;
  $(src + ' tr:nth-child(2)').eq(0).children("td").each(function() {
      $(target + ' tr:first-child').eq(0).children("td")[count].width = $(this).css("width"); //this.offsetWidth+'px';
      count = count + 1;
    }
  });
}
&#13;
&#13;
&#13;