Jquery复制完整表,更改属性

时间:2013-08-28 10:13:55

标签: jquery input html-table arr

我有这个html表

<table id="item-list" class="table table-hover table-striped">
    <thead>
        <tr>
            <th>Item</th>
            <th width="20%">Nombre</th>
            <th width="20%">Prix (TTC)</th>
            <th width="20%" class="actions">Total</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr class="order-item">
            <td><input name="name[1]" type="hidden" class="m-wrap small refrech-calc" value="cardv2">cardv2</td>
            <td><input name="number[1]" type="text" class="m-wrap small refrech-calc" value="15"></td>
            <td><input name="price[1]" type="text" class="m-wrap small refrech-calc" value="42"></td>
            <td><span class="order-amount">630.00</span> €</td>
            <td><button class="btn red mini deleteRowButton"><i class="icon-remove icon-white"></i></button></td>
        </tr>
        <tr class="order-item">
            <td><input name="name[2]" type="hidden" class="refrech-calc" value="cardv2-5">cardv2-5</td>
            <td><input name="number[2]" type="text" class="refrech-calc" value="20"></td>
            <td><input name="price[2]" type="text" class="refrech-calc" value="45"></td>
            <td><span class="order-amount">900.00</span> €</td>
        </tr>
        <tr class="order-item">
            <td><input name="name[3]" type="hidden" class="refrech-calc" value="asuspx800">Asus px800</td>
            <td><input name="number[3]" type="text" class="refrech-calc" value="1"></td>
            <td><input name="price[3]" type="text" class="refrech-calc" value="260"></td>
            <td><span class="order-amount">260.00</span> €</td>
            <td><button class="btn red mini deleteRowButton"><i class="icon-remove icon-white"></i></button></td>
        </tr>
    </tbody>
</table>

我想要生成另一个表,没有输入,但是有了它们的值。 例如:

<table id="item-list" class="table table-hover table-striped">
    ...
    <tbody>
        <tr class="order-item">
            <td>(name[1] values)</td>
            <td>(number[1])</td>
            <td>price[1]</td>
            <td><span class="order-amount">630.00</span> €</td>
        </tr>
        <tr class="order-item">
            <td>name[2]</td>
            <td>number[2]</td>
            <td>price[2]</td>
            <td><span class="order-amount">900.00</span> €</td>
        </tr>
        ....etc
    </tbody>
</table>

确实,我想在另一个“干净”的表格中总结我的输入值。

我的问题是获得正确的输入数组并显示所有这些。

1 个答案:

答案 0 :(得分:0)

尝试这样的事情,FIDDLE

        $(function(){
            var clone_table = $('#item-list').clone();
            $(clone_table).addClass('cloneKlass');

            $('body').append(clone_table);

            $('.cloneKlass input').each(function(){
                $(this).replaceWith(this.value);
            })
        })