复选框，如果选中需要在 div 中求和其价格答案

【问题标题】：checkboxes, if checked need to sums its price in divs复选框，如果选中需要在 div 中求和其价格
【发布时间】：2023-03-09 19:23:01
【问题描述】：

我有一个页面(here you can see it) 如果我点击一个复选框，我需要将其价格与实际价格相加。

复选框有一个value 和一个data-prezzo。这两个数字需要相加为两个不同的 div，如下所示：

value + rata-display-1 = total_rata

data-prezzo + prezzo-somma = total_prezzo

我是新手，所以我不知道为什么它给了我 NaN 而不是正确的总和。

代码如下：

//sommo rata e prezzo dei plus a quelli del DB
var basicPrice_rata = 1000 ; // This is how we start
var basicPrice_prezzo = 50000 ; // This is how we start
    
$(document).on('change', getCheck);
    function getCheck() {
    var currentPrice_rata = basicPrice_rata; // every time
    CurrentPrice_rata = basicPrice_rata;
    var currentPrice_prezzo = basicPrice_prezzo; // every time
    CurrentPrice_prezzo = basicPrice_prezzo;
        plus = [],
        total_rata = 1000;
        total_prezzo = 50000; 

    $("input[type=checkbox]").each(function(i, el) {

        if ($(el).is(":checked")) {
            total_rata += parseInt($(el).val());
            total_prezzo += parseInt($(el).data('prezzo'));

            console.log(total_rata);
            plus.push($(el).data('name')); // get the label text
            }
    });


//inserisco i nomi dei plus nella riga di testo
 $("#plus-display").text(plus.join(", "));
    
//inserisco le rate sommate  nei div corrispondenti
 $('#rata-display-2').text(total_rata +" €");
    
//inserisco i prezzi sommati  nei div corrispondenti
 $('#prezzo-somma').text(total_prezzo +" €");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" value="134.24" data-prezzo="40000" id="box-auto" name="Box auto" data-name="Box auto" class="check-plus w-checkbox-input">
<input type="checkbox" value="17.78" data-prezzo="5000" id="posto-moto" name="Posto moto" data-name="Posto moto" class="check-plus w-checkbox-input">
<input type="checkbox" value="134.24" data-prezzo="40000" id="box-auto" name="Box auto" data-name="Box auto" class="check-plus w-checkbox-input">

<div id="rata-display-2" class="prezzo-checkout">1000 €</div>

<div id="prezzo-somma" class="text-checkout color bold">500000 €</div>

<div id="plus-display" class="text_piccolo black checkout">Interior Pack Incluso nel prezzo</div>

【问题讨论】：

使用$('input[type="checkbox"]:checked')摆脱if ($(el).is(":checked"))
您的 sn-p 没有运行，但是在快速检查了您的实际网站后，问题仅在您单击顶部复选框时出现 - 并且问题（嗯，至少部分) 是这个复选框没有data-prezzo 属性，您的脚本需要能够将其解析为整数。
没有value属性，这就是第二个NaN的原因
嗨@RobinZigmond 好的，我已经解决了这个问题，但现在我遇到了一个不同的问题，当我对价格求和（底价为 500.000，我想求和 20.000）时，它会将总数更改为520 而不是 520.000。当我将其他价格 (1000 + 17,78) 相加时，价格是 licke 27.780 我想我需要格式化数字，但我不知道如何。你能帮帮我吗？
@StefanoZanetti 如果您有其他问题，请提出新问题

标签： javascript jquery html checkbox

【解决方案1】：

您的代码似乎按预期工作，只是缺少函数的关闭}

//sommo rata e prezzo dei plus a quelli del DB
var basicPrice_rata = 1000 ; // This is how we start
var basicPrice_prezzo = 50000 ; // This is how we start
    
$(document).on('change', getCheck);
    function getCheck() {
    var currentPrice_rata = basicPrice_rata; // every time
    CurrentPrice_rata = basicPrice_rata;
    var currentPrice_prezzo = basicPrice_prezzo; // every time
    CurrentPrice_prezzo = basicPrice_prezzo;
        plus = [],
        total_rata = 1000;
        total_prezzo = 50000; 

    $("input[type=checkbox]").each(function(i, el) {

        if ($(el).is(":checked")) {
            total_rata += parseInt($(el).val());
            total_prezzo += parseInt($(el).data('prezzo'));

            //console.log(total_rata);
            plus.push($(el).data('name')); // get the label text
            }
    });


//inserisco i nomi dei plus nella riga di testo
 $("#plus-display").text(plus.join(", "));
    
//inserisco le rate sommate  nei div corrispondenti
 $('#rata-display-2').text(total_rata +" €");
    
//inserisco i prezzi sommati  nei div corrispondenti
 $('#prezzo-somma').text(total_prezzo +" €");
 }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" value="134.24" data-prezzo="40000" id="box-auto" name="Box auto" data-name="Box auto" class="check-plus w-checkbox-input">
<input type="checkbox" value="17.78" data-prezzo="5000" id="posto-moto" name="Posto moto" data-name="Posto moto" class="check-plus w-checkbox-input">
<input type="checkbox" value="134.24" data-prezzo="40000" id="box-auto" name="Box auto" data-name="Box auto" class="check-plus w-checkbox-input">

<div id="rata-display-2" class="prezzo-checkout">1000 €</div>

<div id="prezzo-somma" class="text-checkout color bold">500000 €</div>

<div id="plus-display" class="text_piccolo black checkout">Interior Pack Incluso nel prezzo</div>

【讨论】：

好的，我已经解决了这个问题，但是现在我有一个不同的问题，当我对价格求和时（底价是 500.000，我想求和 20.000），它会将总数更改为 520 而不是520.000。当我将其他价格 (1000 + 17,78) 相加时，价格是 licke 27.780 我想我需要格式化数字，但我不知道如何。你能帮帮我吗？
@StefanoZanetti，在这种情况下，只需使用.toFixed() 就像total_rata.toFixed(3).....谢谢。