Javascript 禁止在添加文本框值后添加这些值

我有几个文本框，应该有数值。在每个文本框的模糊事件中，该特定文本框的值被添加并显示在另一个文本框中。因此，就像有人在第一个文本框中输入10一样，最后一个文本框应该显示10，如果在下一个文本框中输入了20，那么值应该相加，并在最后一个文本框中显示30

<input type="text" class="sum" /> 
<input type="text" class="sum" />
<input type="text" class="sum" />
<input type="text" class="sum" />
<input type="text" class="sum" />

<input type="text" id="total" />

---

可以看出存在一个问题，如果任何文本框再次聚焦，出于任何原因，相同的值将再次计入总计。如何确保文本框中的值在添加到总数后不会再次添加

您可以在每次触发模糊事件时找到一个新的总和

$('.sum').blur(function() {
  var sum = 0;
  $('.sum').each(function(){
     var val = $(this).val();
    if(!isNaN(val) && val != "") {
      sum+=parseFloat(val); 
    }
  });
  $('#total').val(sum);
});

由于您的输入类型不是数字，并且可以接受任何字母数字字符串和特殊字符，因此存在数字检查

$（'.sum'）.blur（函数（）{
var总和=0；
$（'.sum'）。每个（函数（）{
var val=$（this.val（）；
如果（！isNaN（val）&&val！=“”）{
sum+=parseFloat（val）；
}
});
$（'总计'）.val（总和）；
});
不是每次都添加新的，而是每次更改时都对它们进行汇总：


$（'.sum'）.blur（函数（）{
var new_sum=0；
$（'.sum'）。每个（函数（i，el）{
如果（$（el）.val（））{
new_sum+=parseFloat（$（el）.val（））；
}
});
$（'总计'）.val（新金额）；
});

在接受答案之前，请查看答案的时差。先到先得！输入字母或字符将产生总共
NaN
。@DanPhilip你是对的，但OP说他对这件事没有问题。您可以随时添加
！isNan（…）
来检查
$('.sum').blur(function() {
  var sum = 0;
  $('.sum').each(function(){
     var val = $(this).val();
    if(!isNaN(val) && val != "") {
      sum+=parseFloat(val); 
    }
  });
  $('#total').val(sum);
});