Question

你好，

我遇到了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);

}

但是，这会将每个数字添加到字符串中。我希望所有数字都可以互相添加，以便我得到一个数字。

Answer 1

使用parseFloat代替“class”Number。

Number期望值为html，text，attr或data函数返回字符串。

所以你的代码看起来像这样：

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

编辑：您使用的是本地化字符串，因此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>

jQuery动态计算NaN

1 个答案: