来自同一类的不同div的值的总和

Question

我正在加载具有.totalprice类的动态div。最后，我想总结所有.totalprice的值。

Answer 1

对于<div>元素：

var sum = 0; 
$('.totalprice').each(function(){ 
    sum += parseFloat($(this).text()); // Or this.innerHTML, this.innerText 
}); 

你可以看到一个working example of this here

对于<input>元素（输入，复选框等）：

var sum = 0; 
$('.totalprice').each(function(){ 
    sum += parseFloat(this.value); 
}); 

可选地，如果你正在寻找一个int埃格尔，你可以使用parseInt()函数。您可以see a working example of this here。

Answer 2

要建立什么Rionmonster的那样，这个工作对我来说：

HTML：

<div class="totalprice">6.7</div> 
<div class="totalprice">8.9</div> 
<div class="totalprice">4.5</div> 

的JavaScript：

var sum = 0; 
$('.totalprice').each(function() 
{ 
    sum += parseFloat($(this).text()); 
}); 
alert(sum); 

输出：

21.1 

我发现，在获得VA从<div>中你必须使用.text()选择器。这里是小提琴看到它的工作： http://jsfiddle.net/davecoulter/7D7nR/

Answer 3

除非你完全肯定你的内容的价值，你将无法使用parseFloat开箱即用。

你需要确保处理：

• 过多的空白
• 领先$
• 空白
• 意外的字符串

请看：

<div class="totalprice"> $1.25 </div> 
<div class="totalprice">0.25  </div> 
<div class="totalprice">$3.00 </div> 
<div class="totalprice"> 2.50</div> 
<div class="totalprice">$0.01</div> 
<div class="totalprice"> </div> 

下面将处理所有情况：

var sum = 0; 

$(".totalprice").each(function() { 
    var val = $.trim($(this).text()); 

    if (val) { 
     val = parseFloat(val.replace(/^\$/, "")); 

     sum += !isNaN(val) ? val : 0; 
    } 
}); 

console.log(sum); 

参见：http://jsfiddle.net/rwaldron/hfA5V/

Answer 4

如果你这样做很多时候在你的代码，建议把它放在一个漂亮的可重复使用的功能

function removeComma(x) 
{ 
    if (x) 
    { 
     if (x.length > 0) 
     { 
     return x.replace(/,/g,''); 
     } 
    } 
} 
function sum_class(list,source) 
{ 
    // source can be text for non input DOM elements or value for text inputs 
    var total = 0; 
    $(list).each(function() { 
    if (source == 'text') 
    { 
     total += parseFloat(removeComma($(this).text())); 
    } 
    else 
    { 
     total += parseFloat(removeComma($(this).val())); 
     } 
    }); 
    return total; 
} 

请记住，这两个函数都使用我已经命名的变量来说明我的意思，您可以将它们重命名为您理解的更适合您的东西，例如函数sum_class的名称，不是指OOP类，而是Ť他是函数的目的是返回来自属于同一类的元素的值的总和。