如何在$.each循环中累加结果？

Question

你好，我正在尝试读取topmenu元素中每个项目的宽度，并将项目的宽度相加并赋值给一个变量。但是，当我运行这段代码时，在提示框中显示NaN。 请问这段代码有什么问题：

$(document).ready(function(){
    $('.topmenu').each(function(menu){
        var btext = $(this).find('.baritem').width();
        alert(btext);
        var itemswidth = +itemswidth+btext;
        alert(itemswidth);
        //var width = getTextWidth(btext,"arial","40");
        //alert(width);     
    });
});

- milano

---

你能展示一下 HTML 代码吗？ - PSR

undefined + number == NaN的意思是“未定义加上一个数等于非数值”。 - elclanrs

Answer 1

这一行

var itemswidth = +itemswidth+btext;

将undefined添加到数字中，会得到NaN。在进入循环之前，您需要将itemswidth初始化为0：

$(document).ready(function(){
  var itemswidth = 0;
  $('.topmenu').each(function(){
     var btext = $(this).find('.baritem').width();
     itemswidth += btext;
     console.log(itemswidth); // better than alert
  });
});

给Florian的话：

$(document).ready(function(){
    var itemswidth = $('.topmenu .baritem').get().reduce(function(t,e){ 
        return t+$(e).width()
    }, 0);
    console.log(itemswidth);
});

- Denys Séguret

---

@FlorianMargaine 现在满意了吗？ - Denys Séguret

Answer 2

你可以轻松地使用以下方法：

var reduce=Array.prototype.reduce;
var completeWidth=reduce.call($("div"), function(sum, elem){
    sum+=$(elem).width();
    return sum;
}, 0);

http://jsfiddle.net/DSUHG/

- Thomas Junk

---

提及浏览器兼容性会更好 :-) 跟随原始示例会更好。 - Florian Margaine