jQuery-总计总计为多个

时间:2019-07-09 17:47:23

标签: jquery

我正在尝试为每个项目(sum of totalsitem)获得item2。我将sum函数嵌套在每个函数内部,并以该项作为选择器。

如何获取每个唯一项目sum中的total,以计算所有itemitem2的总计?

$(".item").each(function() {
  const item = $(this);
  var qty = $(this).find(".qty").text();
  var price = $(this).find(".cost").text();
  var total = Number(qty) * Number(price);
  $(this).find(".total").text(total);
  var sum = 0;
  $(".total").each(function() {
    sum += parseInt(
      $(this).text());
  });
  $("#grand").text(sum);
});
$(".item2").each(function() {
  const item = $(this);
  var qty = $(this).find(".qty").text();
  var price = $(this).find(".cost").text();
  var total = Number(qty) * Number(price);
  $(this).find(".total").text(total);
  var sum = 0;
  $(".total").each(function() {
    sum += parseInt(
      $(this).text());
  });
  $("#grand2").text(sum);
});
body {
  display: flex
}

.item,
.item2 {
  border: 1px solid;
  width: 50px;
}

.item2 {
  border-color: blue
}

.total {
  border-top: 1px solid;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="item">
  <div class="cost">25</div>
  <div class="qty">45</div>
  <div class="total"></div>
</div>
<div class="item">
  <div class="cost">65</div>
  <div class="qty">105</div>
  <div class="total"></div>
</div>
<div class="item">
  <div class="cost">15</div>
  <div class="qty">95</div>
  <div class="total"></div>
</div>
<div id="grand">0</div>
<div class="item2">
  <div class="cost">65</div>
  <div class="qty">105</div>
  <div class="total"></div>
</div>
<div class="item2">
  <div class="cost">15</div>
  <div class="qty">95</div>
  <div class="total"></div>
</div>
<div id="grand2">0</div>

2 个答案:

答案 0 :(得分:1)

我简化了一些代码。让我知道是否合理。

                                     bible32       bible256       Asymptotical
C++ (prefix tree + heap)             5.659         44.730         O((T + N) log N)
Python (Counter)                     14.366        115.855        O(T + N log Q)
AWK + sort                           21.548        176.411        O(T + Q log Q)
McIlroy (tr + sort + uniq)           60.531        690.906        O(T log T)
var grand = 0, total;

$(".item").each(function(){
  grand += (total = ($(this).find(".qty").text() * $(this).find(".cost").text()));
  $(this).find(".total").text(total);
});
$("#grand").text(grand);

grand = 0;
$(".item2").each(function(){
  grand += (total = ($(this).find(".qty").text() * $(this).find(".cost").text()));
  $(this).find(".total").text(total);
});
$("#grand2").text(grand);
body {
  display: flex
}

.item,
.item2 {
  border: 1px solid;
  width: 50px;
}

.item2 {
  border-color: blue
}

.total {
  border-top: 1px solid;
}

答案 1 :(得分:1)

我做了尽可能少的更改,但是如果您愿意,可以将其重构

您是JS,需要更加类似于以下内容:

$(".item").each(function() {
    const item = $(this);
    var qty = $(this).find(".qty").text();
    var price = $(this).find(".cost").text();
    var total = Number(qty) * Number(price);
    $(this).find(".total").text(total);
});

var sum1 = 0;
$(".item .total").each(function() {
    sum1 += parseInt(
    $(this).text());
});
$("#grand").text(sum1);

$(".item2").each(function() {
    const item = $(this);
    var qty = $(this).find(".qty").text();
    var price = $(this).find(".cost").text();
    var total = Number(qty) * Number(price);
    $(this).find(".total").text(total);
});

var sum2 = 0;
$(".item2 .total").each(function() {
    sum2 += parseInt(
    $(this).text());
});
$("#grand2").text(sum2);

您要为循环中的每个sum0重置为.item,有效地将总数保持在0。最重要的是,您尝试遍历每个.total的所有.item。即如果您有3个项目,则需要拨打.totals 9次。我已经拉出了变量声明(sum1sum2),并从项循环中拉出了实际的总计循环以克服这个问题。

这是一个工作的小提琴:https://jsfiddle.net/6xqg74by/