JQuery Expand Table - 添加额外的列答案

【问题标题】：JQuery Expand Table - adding additional columnsJQuery Expand Table - 添加额外的列
【发布时间】：2014-01-09 19:42:16
【问题描述】：

我正在使用 JExpand 并允许我扩展表格中的其他行。与原始表格相比，我希望这些可扩展的行包含更多列。

我正在使用的表格的代码是：示例小提琴：http://jsfiddle.net/sB5g9/1/

<body>
    <table id="results" >
        <tr>
            <th>Select</th>
            <th>Population</th>
            <th>Area</th>
            <th>Official languages</th>
            <th>Other</th>
        </tr>
        <tr>
            <td><select name='mode[]' class='mode' /><option value='0:0'></option><option value='1:0'>View</option><option value='2:0'>Additional</option></select></td>
            <td>306,939,000</td>
            <td>9,826,630 km2</td>
            <td>English</td>
            <td>English</td>
        </tr>
        <tr style="background-color:#FFF">  <!-- hidden -->
                    <td><b>Additional Settings</b></td>
                    <td>306,939,000</td>
                    <td>9,826,630 km2</td>
                    <td>English</td>
                    <td>English</td>
        </tr>   <!-- hidden -->
        <tr>
            <td><select name='mode[]' class='mode' /><option value='0:0'></option><option value='1:0'>View</option><option value='2:0'>Additional</option></select></td>
            <td>306,939,000</td>
            <td>9,826,630 km2</td>
            <td>English</td>
            <td>English</td>
        </tr>
        <tr style="background-color:#FFF">  <!-- hidden -->
                    <td><b>Additional Settings</b></td>
                    <td>306,939,000</td>
                    <td>9,826,630 km2</td>
                    <td>English</td>
                    <td>English</td>
        </tr>   <!-- hidden -->
        <tr>
            <td><select name='mode[]' class='mode' /><option value='0:0'></option><option value='1:0'>View</option><option value='2:0'>Additional</option></select></td>
            <td>306,939,000</td>
            <td>9,826,630 km2</td>
            <td>English</td>
            <td>English</td>
        </tr>
        <tr style="background-color:#FFF">  <!-- hidden -->
                    <td><b>Additional Settings</b></td>
                    <td>306,939,000</td>
                    <td>9,826,630 km2</td>
                    <td>English</td>
                    <td>English</td>
        </tr>   <!-- hidden -->

   </table>
</body>

我目前拥有的如下所示。当您选择附加时，将显示该行，并且它具有与原始表相同的列数。这可以在红色突出显示中看到。

我希望在扩展行中有更多列，如黄色高亮示例中所示...

知道我该怎么做吗？可展开的行可能包括表格文本字段、下拉列表等。

【问题讨论】：

标签： php jquery html-table

【解决方案1】：

当我有类似要求时，我使用了colspan 和rowspan

【讨论】：