Javascript 使用JQuery获取多个表的运行平衡

我有几张结构相同的桌子。它在价格上有不同的价值。我想得到price列的运行余额。所以我想得到总和并在running balance列中打印每个迭代。例如在价格栏中，我有400425和350，所以在流动余额栏中，我应该有4008251175。目前，我只得到总数

这是我的html

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>

<table class="table table-striped">
  <thead>
    <tr>
      <th width="60%">Item</th>
      <th width="20%">Price</th>
      <th width="20%">Running Balance</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Bacon</td>
      <td class="price">1300</td>
      <td class="runningBal"></td>
    </tr>
    <tr>
      <td>Pancakes</td>
      <td class="price">300</td>
       <td class="runningBal"></td>
    </tr>
    <tr>
      <td><b>Total:</b></td>
      <td class="total"><b>$</b></td>
       <td class="totalBal"></td>
    </tr>
  </tbody>
</table>
<br>

<table class="table table-striped">
  <thead>
    <tr>
      <th width="60%">Item</th>
      <th width="20%">Price</th>
      <th width="20%">Running Balance</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Fries</td>
      <td class="price">400</td>
      <td class="runningBal"></td>
    </tr>
    <tr>
      <td>Nuggets</td>
      <td class="price">425</td>
      <td class="runningBal"></td>
    </tr>
    <tr>
      <td>Ice Cream</td>
      <td class="price">350</td>
      <td class="runningBal"></td>
    </tr>
    <tr>
      <td><b>Total:</b></td>
      <td class="total"><b>$</b></td>
      <td class="totalBal"></td>
    </tr>
  </tbody>
</table>

---

下面是一个

评论中的人说得对，如果产品价格不变，那么在循环时应该将其呈现在服务器端

无论如何，这将完成工作：

$（“表”）。每个（函数（）{
var总和=0；
$（this.find（“.runningBal”）.each（function（））{
sum+=+$（this.prev（“.price”）.text（）；
$（本）.text（总和）；
});
})

项目
价格
运行平衡
培根
1300
烙饼
300
总数：
$


项目
价格
运行平衡
炸薯条
400
金块
425
冰淇淋
350
总数：
$

如何生成这些表？您应该计算运行平衡并在表呈现期间放置它..我使用PHP的foreach生成表，但我在这里只显示了一个不太复杂的版本，然后当您遇到price时，您应该将其存储在一个变量中，并在运行平衡列中回显它。简单地说，如果你不改变客户端的价格，那么最好将逻辑放在php端。我只是觉得使用jquery会更简单。@Panther是对的-应该在服务器端处理…非常感谢。我知道他们是对的，但这有点复杂。这就是为什么我认为只使用jquery会更容易。再次感谢

$('.runningBal').each(function() {
  var sum = 0;
  $(this).parents('table').find('.price').each(function() {
    var floted = parseFloat($(this).text());
    if (!isNaN(floted)) sum += floted;

    $('.runningBal').html(sum);
  })

  //$(this).html(sum);
});