如何遍历表和sum值jquery [英] How to iterate through table and sum values jquery

问题描述

有人可以帮我解决如何遍历我的表并总结每行的数量*价格的价值吗？这是我的表：

Can someone help me with how to iterate through my table and summing the value of quantity * price for each row? Here's my table:

<table id="template_item_table" class="table table-striped">
            <thead>
                <tr>
                    <th>Product Code</th>
                    <th>Unit Price ($)</th>
                    <th>Quantity</th>
                    <th></th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>12345</td>
                    <td>50</td>
                    <td><input type="text" class="form-control quantity" name="quantity"></td>
                    <td><button class="btn btn-primary"><a href="/product/{{product_code}}">Item Details</a></button></td>
                    <td><button class="btn btn-danger">Remove Item</button></td>
                </tr>
                <tr>
                    <td>2222</td>
                    <td>53</td>
                    <td><input type="text" class="form-control quantity" name="quantity"></td>
                    <td><button class="btn btn-primary"><a href="/product/{{product_code}}">Item Details</a></button></td>
                    <td><button class="btn btn-danger">Remove Item</button></td>
                </tr>
            </tbody>
        </table>

我已经达到：

$("#template_item_table tr").each(function() {

        });

但我不确定如何继续......

But I'm not sure how to proceed...

推荐答案

你需要选择第二个td并乘以第三个td中输入的值：

You need to select the 2nd td and multiply by the value of the input in the third td:

$("#template_item_table tbody tr").each(function() {
   var value = $(this).find(" td:nth-child(2)").html();
   console.log(value);

  var quantity = $(this).find(" td:nth-child(3) input").html();
  console.log(quantity);

  var total = value * quantity;
  console.log(total);
});

您可能希望将其全部包含在输入字段的更改绑定中，以便它只在他们改变时运行。

You'd probably want to wrap it all in an on change binding for the input fields so it only runs when they change.

这篇关于如何遍历表和sum值jquery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！