Question

如何将html表中的行拆分为多个（子）行？（我没有使用rowspan来跨越多行，因为我使用的是称为“同步”的rails gem，它一次只能更新一个表行。）

例如，如何在表中创建单行：

有一行
分为2个子行
被拆分为4个子行（前一列中的第一行被拆分为2个子行，前一列中的第2行被拆分为2个子行）。

这只是一个例子。我需要能够动态决定在运行时拆分行的方式。

编辑：请参阅下面的结构，如上面的要点所述（尽管请注意我试图在单个表行中实现此结构，即不使用rowspan）

<table>
    <tr>
        <td rowspan=4>1</td>
        <td rowspan=2>2</td>
        <td >3</td>
    </tr>

    <tr>
        <td >4</td>
    </tr>

    <tr>
        <td rowspan=2>2</td>
        <td >5</td>
    </tr>

     <tr>
        <td >6</td>    
     </tr>

http://jsfiddle.net/40ukzvz1/

Answer 1

您可以尝试嵌套表格，以使每个表格结构都不受其所在单元格的影响。

请参见代码示例：

<table width="100%" border bgcolor="red">
  <tr>
    <td>a</td>
    <td>b</td>
    <td>c</td>
  </tr>
  <tr>
    <td>
      <table width="100%" border bgcolor="green">
        <tr>
          <td>1</td>
        </tr>
        <tr>
          <td>2</td>
        </tr>
      </table>
    </td>
    <td>
      <table width="100%" border bgcolor="blue">
        <tr>
          <td>1</td>
        </tr>
        <tr>
          <td>2</td>
        </tr>
        <tr>
          <td>3</td>
        </tr>
      </table>
    </td>
    <td>
      <table width="100%" border bgcolor="yellow">
        <tr>
          <td>1</td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td>a</td>
    <td>b</td>
    <td>c</td>
  </tr>
</table>

将html行拆分为多个（子）行

1 个答案: