删除项目时的JavaScript计算

从表中删除行时出现问题。我有一个计算总价格、小计等的函数，可以很好地工作

但是，如果我删除一行，它将不会重新计算它，即删除成本

1） 我如何解决这个问题？
2） 如何使NaN不出现在“总价”列中-已修复
3） 我不是JavaScript方面的专家，因此对于改进现有代码方面的任何帮助都将不胜感激

编辑：在代码段中包含用于删除行的x（问题是，当您在一行中输入值时，它会计算它们，然后当您删除该行时，它不会从总数中删除值）

$（函数（）{
$（“.calculate rows”）.keyup（函数（事件）{
var合计=0；
$（“.calculate rows”）.each（函数（）{
var gtotal=0；
$（this.find（“.rows”）.each（function（）{
var qty=parseFloat（$（this.find（“.quantity”）.val（））；
var rate=parseFloat（$（this）.find（“.unit price”）.val（））；
如果（isNaN（数量））{
数量=0；
}
如果（isNaN（费率））{
比率=0；
}
var小计=数量*比率；
var小计=数量*比率；
$（此）.find（“.total price”）.val（小计toFixed（2））；
如果（！isNaN（小计））
G总计+=小计；
$（“.subtotal”）.html（£；“+gtotal.toFixed（2））；
var折扣=$（'.discount'）.val（）；
风险值折扣=（（总价值/100）*折扣）；
风险价值总额=（总价值-折扣）.toFixed（2）；
如果（！isNaN（总计））
$（“.total price”）.html（£；“+总计）；
});
});
});
});
变量包装器=$（'#addrow'）；
var newitem=$（'.newitem'）；
var removietem=$（'.removietem'）；
$（新建项）。单击（函数（e）{
e、 预防默认值（）；
$newrow=$（''）；
$（包装器）.append（$newrow）；
$newrow.on（“单击”，“a”，函数（e）{
e、 预防默认值（）；
$（this.parent（）.parent（）.remove（）；
});
});
$（删除项）。单击（函数（e）{
e、 预防默认值（）；
$（this.parent（）.parent（）.remove（）；
});

项目
描述
量
单价（£；）
总价（£；）
小计：
&163；0.00
折扣：
%
大桶：
和#163；0
应付金额：
&163；0
为了使计算工作正常，当您删除一行时，请将计算逻辑包装在函数calculate（）中，并在删除一行时调用该函数

关于NaN，您只需确保当的文本框中的“数量”和“单价”为空时，变量“数量”和“单价”应默认为0

$(function() {
  $(".calculate-rows").keyup(function(event) {
    calculate();
  });
});

function calculate() {
    var total = 0;
    $(".calculate-rows").each(function() {
      var gtotal = 0;
      $(this).find(".rows").each(function() {
        var qty = parseFloat($(this).find(".quantity").val());
        var rate = parseFloat($(this).find(".unit-price").val());
          if (isNaN(qty) ) qty = 0;             
          if (isNaN(rate) ) rate = 0;

        var subtotal = qty * rate;
        $(this).find(".total-price").val(subtotal.toFixed(2));
        if (!isNaN(subtotal))
          gtotal += subtotal;
        $(".subtotal").html("£" + gtotal.toFixed(2));
        var discount = $('.discount').val();
        var discount = ((gtotal / 100) * discount);
        var total = (gtotal - discount).toFixed(2);
        if (!isNaN(total))
          $(".total-price").html("£" + total);
      });
    });
}

var wrapper = $('#addrow');
var newitem = $('.newitem');
var removeitem = $('.removeitem');
$(newitem).click(function(e) {
  e.preventDefault();
  $newrow = $('<tr class="rows"><td style="border-top: none;"><input class="form-control" type="text" name="name" required></td><td style="border-top: none;"><textarea class="form-control" rows="1" name="description"></textarea></td><td style="border-top: none;"><input class="text-center form-control quantity" type="text" value="" name="quantity"></td><td style="border-top: none;"><input class="text-center form-control unit-price" type="text" value="" name="unit_price"></td><td style="border-top: none;"><input class="form-control text-center total-price" type="text" value="0.00" readonly></td><td style="border-top: none;" class="text-center"><a class="removeitem" href="#"><i class="fa fa-times"></i></a></td></tr>');
  $(wrapper).append($newrow);
  $newrow.on("click", "a", function(e) {
    e.preventDefault();
    $(this).parent().parent().remove();
      calculate();
  });
});
$(removeitem).click(function(e) {
  e.preventDefault();
  $(this).parent().parent().remove();
    calculate();
});

$（函数（）{
$（“.calculate rows”）.keyup（函数（事件）{
计算（）；
});
});
函数计算（）{
var合计=0；
$（“.calculate rows”）.each（函数（）{
var gtotal=0；
$（this.find（“.rows”）.each（function（）{
var qty=parseFloat（$（this.find（“.quantity”）.val（））；
var rate=parseFloat（$（this）.find（“.unit price”）.val（））；
如果（isNaN（数量））数量=0；
如果（isNaN（速率））速率=0；
var小计=数量*比率；
$（此）.find（“.total price”）.val（小计toFixed（2））；
如果（！isNaN（小计））
G总计+=小计；
$（“.subtotal”）.html（£；“+gtotal.toFixed（2））；
var折扣=$（'.discount'）.val（）；
风险值折扣=（（总价值/100）*折扣）；
风险价值总额=（总价值-折扣）.toFixed（2）；
如果（！isNaN（总计））
$（“.total price”）.html（£；“+总计）；
});
});
}
变量包装器=$（'#addrow'）；
var newitem=$（'.newitem'）；
var removietem=$（'.removietem'）；
$（新建项）。单击（函数（e）{
e、 预防默认值（）；
$newrow=$（''）；
$（包装器）.append（$newrow）；
$newrow.on（“单击”，“a”，函数（e）{
e、 预防默认值（）；
$（this.parent（）.parent（）.remove（）；
计算（）；
});
});
$（删除项）。单击（函数（e）{
e、 预防默认值（）；
$（this.parent（）.parent（）.remove（）；
计算（）；
});
听起来像是在使用过时的jQuery对象从…获取值。请检查更新数据源。
在添加/删除行后，通过调用
$（“.calculate rows”）.keyup（）尝试重新触发keyup事件
您能详细说明一下吗？我认为@sjerp的意思是使用data属性。谢谢你，你知道当一行被删除时，它将如何改变值吗？