总结基于类的表列的所有值

我试图根据特定的类检索td中所有值的总和。代码不会抛出任何错误，但我的总和保持为“0”。总结基于类的表列的所有值

是否必须以特定方式指定数值？我在这里看到了一些其他的答案，从哪里模仿了代码，我没有看到我和他们之间有任何真正的区别，所以我很困惑，为什么我的工作没有。

这里是一个教程我也跟着以供参考：http://viralpatel.net/blogs/2009/07/sum-html-textbox-values-using-jquery-javascript.html

这里是我的javascript

$(document).ready(function(){ 
$('.price').each(function() { 
    calculateSum(); 
}); 
}); 

function calculateSum() { 

var sum = 0; 
//iterate through each td based on class and add the values 
    $(".price").each(function() { 

     //add only if the value is number 
     if(!isNaN(this.value) && this.value.length!=0) { 
      sum += parseFloat(this.value); 
     } 

    }); 
$('#result').text(sum);  
};

这里是我的html

<table border="1"> 
<tr> 
<th>Item</th> 
<th>Price</th> 
</tr> 
<tr> 
<td>Banana</td> 
<td class ="price">50</td> 
</tr> 
<tr> 
<td>Apple</td> 
<td class ="price">100</td> 
</tr> 
</table> 

<div id="result"></div>

来源

2012-02-15 Khuram Malik

你想用text()，而不是this.value（自<td> s没有“价值”）：

var sum = 0; 
// iterate through each td based on class and add the values 
$(".price").each(function() { 

    var value = $(this).text(); 
    // add only if the value is number 
    if(!isNaN(value) && value.length != 0) { 
     sum += parseFloat(value); 
    } 
});

此外，您正在循环遍历您的.price元素（调用calculateSum）多次。你可以用

$(calculateSum);

来源

2012-02-15 12:36:59

非常高兴谢谢你。我不知道你可以按照你描述的方式缩短循环元素的代码。这非常有用。谢谢 – 2012-02-15 14:09:40

好吧，我没有缩短循环的代码。你在循环两次;一个在'onload'处理函数中，另一个在'calculateSum（）'函数本身中。我删除了前者。我做了'ready'处理程序定义的快捷方式。 – 2012-02-15 14:16:01

它帮助我，谢谢罗布 – StreetCoder 2013-11-07 10:06:07

更换

$(document).ready(function(){ 
    $('.price').each(function() { 
     calculateSum(); 
    }); 
});

我有一个jQuery插件，Sumtr，处理这一相当不错，如果你想有一个摘要行。

这是你的example与插件。

来源

2012-03-28 20:40:12 Larsenal

这真的很干净。我希望我早点看过这个图书馆。它会为我节省一些时间。无论如何感谢您的回复。我会密切留意以备日后参考。 – 2012-03-29 19:08:55

昨天刚刚创建。 :-) – Larsenal 2012-03-29 22:27:48

这个工程很好，它也处理多列，这是我正在寻找的。非常感谢！ – hanzolo 2013-03-01 22:16:31

总结基于类的表列的所有值

回答

相关问题