jQuery的動態計算的NaN

我有一個問題與jQuery，我真的不明白爲什麼。我對jQuery並不陌生，但讓我們說我有很多東西要學。

問題是我有一個生成的列表，其中包含一個跨度。 <span class="cost-value">7.040,00</span>。這不是唯一的，它們有一整行。現在，我想要的是跨度的每個值都被添加到數字中，以便我得到所有這些數字的總和。

爲此，我寫了下面的代碼。

function countCart(){ 

    var sum = 0; 
    $(".cost-value").each(function() { 
     sum =+ Number($(this).html()); 
    }); 

    $('.cost-total').html(sum); 

}

然而，測試時，sum不會返回NaN。我在這裏做錯了什麼？我試着用數據屬性來做，結果也是一樣。

更新：好的。我試過一些建議。代碼如下：

function countCart(){ 

    var sum = 0; 
    $(".cost-value").each(function() { 
     sum += $(this).data("cost"); 
    }); 

    console.log(sum); 
    $('.cost-total').html(sum); 

}

但是，這會將每個數字加到字符串中。我希望所有的數字都加在彼此之間，這樣我就可以得到一個數字。

來源

2017-06-15 Synthiatic

您的跨度不具有數據成本屬性。將數據成本='7.040,00'添加到您的跨度，然後重試。 –

或使用'sum + = Number（$（「this）.text（））' –

使用'.text（）'而不是'.html（）' - 但在這種情況下應該是一樣的。 '= +'而不是'+ =' –

使用parseFloat而不是使用「類」Number。

Number預計一個數字值而html，text，attr或data函數返回一個字符串。

所以，你的代碼看起來就像這樣：

編輯：您使用的是本地化的字符串，所以parseFloat不應該工作。您最好的「賭注」是將「原始」值放在data屬性中，並用data函數（不省略使用parseFloat）檢索該值。

這裏是我的建議代碼：

function countCart(){ 
 
    var sum = 0; 
 
    $(".cost-value").each(function() { 
 
     sum += parseFloat($(this).data("cost")); 
 
    }); 
 
    $('.cost-total').html(sum.toLocaleString("de-DE", {minimumFractionDigits: 2})); 
 
} 
 

 
countCart();

.cost-total { 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="cost-value" data-cost="7040.00">7.040,00</span> 
 
<span class="cost-value" data-cost="3040.00">3.040,00</span> 
 
<span class="cost-value" data-cost="2040.00">2.040,00</span> 
 
<span class="cost-value" data-cost="1040.00">1.040,00</span> 
 
<span class="cost-total"></span>

來源

2017-06-15 09:22:32

'Number（「123」）''可以正常工作，所以傳遞一個字符串並不是問題，儘管同意'parseFloat'。 –

但字符串是本地化的。看看成千上萬的分手和小數。 –

確實 - 這就是爲什麼'Number'失敗（7.040,00不被識別爲數字） - *然而* parseFloat *也有*相同的問題，只是忽略了它不喜歡的位 - 所以本地化的7.040,00 （我假設意味着7000和40）被解析爲7.04（7點零4）。 –

jQuery的動態計算的NaN

回答

相關問題