總結基於類的表列的所有值

我試圖根據特定的類檢索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

總結基於類的表列的所有值

回答

相關問題