循环遍历表中的多个数组并组合成单个数组

Question

我正在工作的项目有一个表，其中包含标题，数字，金钱和复选框的多个结果。 我需要确定该复选框是否未选中，并且不会将结果合并到单个数组中。 我们如何做到这一点 ？ 好心的建议

我想结合例如：

成单个数组，如：

总和大,1.9995,1;总和小,1.9995,1;虎,1.9995,1;

html：

<tbody id="confirm-table-body">
<tr>
    <td> 总和大</td>
    <td style="color: red">1.9995</td>
    <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td> 总和小</td>
    <td style="color: red">1.9995</td>
    <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td> 虎</td>
    <td style="color: red">1.9995</td>
    <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td colspan="2">组数: <span id="confirm-gropup-nums">3</span></td>
    <td colspan="2">总金额: <span id="confirm-total-amount">3</span></td>
</tr>
</tbody>

JS：

"确定": function(){
                var count = parseFloat($('#confirm-total-amount').html());
                if(!isNaN(count) && count == 0){
                    alert("Please enter money!");
                }else{ 
                    Combine single array here !!!!

                }
            },

Answer 1

尝试这个，

 function getCheckedRows() { var arr = []; $('table :checkbox:checked').each(function() { td = $(this).closest('tr').find('td'); arr.push([$(td[0]).text(), $(td[1]).text(), $(td[2]).find('input').val()].join()); }); $('#confirm-total-amount').text($('table :checkbox:checked').length) return arr.join(';'); } $('table :checkbox').on('change', function() { console.log(getCheckedRows()); }); console.log(getCheckedRows()); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tbody id="confirm-table-body"> <tr> <td> 总和大</td> <td style="color: red">1.9995</td> <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td> <td><input type="checkbox" checked=""></td> </tr> <tr> <td> 总和小</td> <td style="color: red">1.9995</td> <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td> <td><input type="checkbox" checked=""></td> </tr> <tr> <td> 虎</td> <td style="color: red">1.9995</td> <td style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td> <td><input type="checkbox" checked=""></td> </tr> <tr> <td colspan="2">组数: <span id="confirm-gropup-nums">3</span></td> <td colspan="2">总金额: <span id="confirm-total-amount">3</span></td> </tr> </tbody> </table> 

Answer 2

可以使用jquery完成。 为了方便使用，我添加了一些td类。

HTML：

<tbody id="confirm-table-body">
<tr>
    <td class="title"> 总和大</td>
    <td class="number" style="color: red">1.9995</td>
    <td class="money" style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td class="title"> 总和小</td>
    <td class="number" style="color: red">1.9995</td>
    <td class="money" style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td class="title"> 虎</td>
    <td class="number" style="color: red">1.9995</td>
    <td class="money" style="padding: 3px 10px 3px 10px"><input value="1" style="width: 80px"></td>
    <td><input type="checkbox" checked=""></td>
</tr>
<tr>
    <td colspan="2">组数: <span id="confirm-gropup-nums">3</span></td>
    <td colspan="2">总金额: <span id="confirm-total-amount">3</span></td>
</tr>
</tbody>

JS：

function(){
        var count = parseFloat($('#confirm-total-amount').html()),
            output = [];
        if (!isNaN(count) && count == 0) {
            alert("Please enter money!");
        } else { 
            $("td input[type=checkbox]:checked").each(function() {
                var $parent = $(this).parent();

                output.push({
                    "title": $parent.find(".title").html(),
                    "number": $parent.find(".number").html(), 
                    "money": $parent.find(".money input").val(),
                })
            })
        }
    }