Question

我实现了以这种格式存储数据。这显示了每个类别（例如食品，服装）的总费用。

var `obj` = {}; `obj` = {FOOD: 1000, CLOTHES: 2000}

新输入后，该值应被覆盖。例如，当选择“ FOOD”并添加值“ 500”时，obj应该更新为obj = {FOOD: 1500, CLOTHES: 2000}。

但是，obj中的值不断加总已经计算出的值。我只希望将新值添加到每个类别的总数中。

var obj = {};
$('.singleRow').each(function(rowIndex, row) {
  var key = $(row).find('select').val();
  if (!obj[key]) {
    obj[key] = 0;
    obj[key] += $(row).find('.cost').val() * 1;
  } else {
    obj[key] += $(row).find('.cost').val() * 1;
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
  <div id="0" class="singleRow" style="clear: both;">
    <span id="add-row" class="glyphicon glyphicon-plus"></span>
    <input class="tableForSpreadsheet" type="text" id="0:0">
    <input class="tableForSpreadsheet" type="text" id="0:1">
    <select class="tableForSpreadsheet form-control" id="0:2">
      <option selected="selected">FOOD</option>
      <option>CLOTHES</option>
    </select>
    <input class="tableForSpreadsheet cost" type="text" id="0:3">
  </div>
</div>

由于我使用的是each()，因此总费用的计算始终从第一行开始。但是，我只希望每个值仅被添加一次。如何解决我的代码以实现此目的？

Answer 1

应该在某个地方触发代码段以计算值并更新obj。另外可能还有另一个地方，为用户提供了添加新行的功能。

我想到两件事；

您可以从头开始计算所有食物和食物。因此，在遍历之前先清空对象。
您可以将事件侦听器独立添加到每一行，并相应地更新obj。更新后，您应该删除其事件监听器，以免干扰数据。否则，您将需要记住先前的值并进行一些更复杂的计算，例如从obj中删除先前的值并添加新的值。

在jQuery中使用each（）添加每行的值

1 个答案: