Question

如何使用Javascript将此行添加到具有此结构的表中？

基本上我希望能够单击一个按钮并在表格中为下面使用的每个列创建一个新行。例如，它可能是名称：新书，数量：30等。

<table id="dynamictable">
    <tbody>
        <tr>
            <td class="name">My Favorite book</td>
            <td class="quantity">x&nbsp;20</td>
            <td class="unit_price">£8.99</td>
            <td class="total">£179.80</td>
            <td class="remove">
                <img src="image/cross.png">
            </td>
        </tr>
    </tbody>
</table>

Answer 1

var newRow = '<tr><td class="name">New Book</td>[...]</tr>'; // add all your code here
$('#dynamictable tbody').append(newRow);

应该这样做（未经测试）。

Answer 2

点击按钮时克隆第一行。填写新数据。然后将它附加到表格中。

$( '#mybutton' ).click(function(){
    var tr = $('#dynamictable tr').eq(0).clone();

    tr.find('td').each(function(){
        $(this).html( 'Put Your Data Here.' );
    });

    $('#dynamictable').append(tr);


});

jsFiddle：http://jsfiddle.net/4hrVQ/1/

如何使用Javascript将此行添加到具有此结构的表中？

2 个答案: