Question

我正在尝试在数组中添加数字并使用添加的数字更新DOM。然后，当向数组添加更多数字时，再次运行添加函数时，将重新评估该数组，并使用数组在数组中添加的内容更新DOM。

目前，它只显示数组中的最后一个数字，而不是添加数组中的数字。谢谢你的帮助。

JavaScript的：

var numb = [];
var total = '';

$('.new').on('click', function(){
    var infoStuff = $('.to-add input').val();
    $('.added').append('<div class="test">'+ infoStuff + '</div>');
    numb.push(infoStuff);
});

$('.button').on('click', function(){
    for(var i=0; i < numb.length; i++){
        total = Number(numb[i]);
    }
    $('.total').html(total);
});

Answer 1

看看这个小提琴：http://jsfiddle.net/t8htbo5u/3/

var numb = [];

$('.new').on('click', function(){
        var infoStuff = $('.to-add input').val();
        $('.added').append('<div class="test">'+ infoStuff + '</div>');
        numb.push(parseInt(infoStuff));
});

$('.button').on('click', function(){
    $('.total').html(numb.reduce(function(prev, curr){
        return prev + curr;
    }, 0));
});

我使用Array.reduce并在parseInt上运行infoStuff，然后将其添加到numb，为了示例，您可以更改它想要取小数

Answer 2

您需要将新值添加到循环内的total，而不是为其分配新值。另外，将total声明为局部变量 - 否则新数字将被添加到先前计算的总和中：

$('.button').on('click', function () {
  var total=0; // local variable, starts with 0 every time
  for (var i = 0; i < numb.length; i++) {
    total += Number(numb[i]); // add the number to existing total
  }
  $('.total').html(total);
});

Updated Fiddle

如何在数组中添加数字，并在向阵列添加更多数字时重新评估和添加数字？

2 个答案: