Question

请您查看This Demo Fiddle并告诉我如何通过复选框从表格到新动态表格中将所选行的值附加到其中？

到目前为止，我已尝试过这个

var td1 = [];
$('#btn').on('click', function () {
    var checkedRows = [];
    $(':checkbox:checked').closest('tr').each(function () {
        checkedRows.push(
        $(this).find('td:gt(0)').map(function () {
            return $(this).html();
        }).get());
    });

    for (var i = 0; i < checkedRows.length; i++) {
        td1.push(parseInt(checkedRows[i][1]));
        td1.push(parseInt(checkedRows[i][5]));
        td1.push(parseInt(checkedRows[i][3]));
        td1.push(parseInt(checkedRows[i][4]));
    }
    $('pre.out').text(JSON.stringify(td1));
    for (var i = 0; i < checkedRows.length; i++) {
        //  $('#newTable').append('<tr>');

    }
});

但我在处理二维数组checkedRows的加载时迷路了所以我试图先将每一行加载到td1，但仍然感到困惑！

请注意，我并不是要让新表中的所有单元格都值，并且它必须只有来自同一个值的值。这是HTML

<table border="1" width="100%">
    <thead>
        <tr>
            <td></td>
            <td>Model 1</td>
            <td>Shop 2</td>
            <td>Shop 3</td>
            <td>Shop 4</td>
            <td>Shop 5</td>
            <td>Shop 6</td>
            <td>Shop 7</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><input type='checkbox' /></td>
            <td>Model 1</td>
            <td>20000</td>
            <td>50000</td>
            <td>20000</td>
            <td>88000</td>
            <td>44000</td>
            <td>30000</td>
        </tr>
        <tr>
            <td><input type='checkbox' /></td>
            <td>Model 2</td>
            <td>20000</td>
            <td>50000</td>
            <td>20000</td>
            <td>88000</td>
            <td>44000</td>
            <td>30000</td>
        </tr>
    </tbody>
</table>
<br />
<input id="btn" type="button" label="button" value="get rows" />

<pre class="out"></pre>


<table border="1" width="100%">
    <thead>
        <tr>
            <td>Shop 2</td>
            <td>Shop 6</td>
            <td>Shop 4</td>
            <td>Shop 5</td>
        </tr>
    </thead>
    <tbody id="newTable">
    </tbody>
</table>

由于

Answer 1

你已经完成了更难的部分，现在在数组中检查了所有行的数据，你可以使用append（）并为它创建tr / td代码：

for (var i = 0; i < checkedRows.length; i++) {
    $('#newTable').append('<tr>' + 
                          '<td>' + checkedRows[i][1] + '</td>' + 
                          '<td>' + checkedRows[i][5] + '</td>' + 
                          '<td>' + checkedRows[i][3] + '</td>' +  
                          '<td>' + checkedRows[i][4] + '</td>' + 
                          '</tr>');
}

Fiddle

奖励：如果你想避免重复，只需改变这一行：

$(':checkbox:checked').closest('tr').not(".copied").each(function() {
    $(this).addClass("copied");

Fiddle。然后，您可以禁用ckeckbox或任何您想要显示的用户，他不能再复制该行。

从现有表生成动态表的问题

1 个答案: