Multipliziert Datenwert mit JQuery

Question

Ich habe einige Kontrollkästchen, die wie folgt aussehen:

ich die Daten-raw-Preis & Daten-Preis mit 3 multiplizieren wollen, wenn ich eine größere Größe in einem Drop-Down wählen.

Ich habe versucht, so etwas wie dieses:

$(document).on('change', '#pa_size', function() { 
 

 
     if ($("#pa_size").val() == "32cm-normal") { 
 
     var value = parseFloat($(".addon-checkbox").data('price').val()); 
 
     $(".addon-checkbox").data('price').val(value * 3); 
 
     } else { 
 

 
     $(".addon-checkbox").data('price'); 
 
     } 
 

 

 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="pa_size" class="" name="attribute_pa_size" data-attribute_name="attribute_pa_size"> 
 
    <option value="" selected="selected">Válassz egy lehetőséget</option> 
 
    <option value="32cm-normal" class="attached enabled" selected="selected">32 cm (normál)</option> 
 
    <option value="52cm-csaladi" class="attached enabled">52 cm (családi)</option> 
 
</select> 
 
<input type="checkbox" class="addon addon-checkbox" name="addon-4851-husok-2[]" data-raw-price="250" data-price="250" value="sonka">

Aber ich bin wirklich nicht sicher, wie diese Werte und muliply zu adressieren.

Thx

Answer 1

Sie brauchen nicht val() zu verwenden. Sie erhalten das Datenattribut ohne das, es funktioniert auch nicht mit val().

So ändern:

parseFloat($(".addon-checkbox").data('price')).val(); 

dazu:

parseFloat($(".addon-checkbox").data('price')); 

Auch data() keine Daten Attribut eines Elements aktualisieren, weist es sie nur im Speicher. Sie müssen dafür attr() verwenden und es sollte funktionieren.

Versuchen Sie folgendes:

$(document).on('change', '#pa_size', function() { 
 
    if ($("#pa_size").val() == "32cm-normal") { 
 
    var dataPrice = parseFloat($(".addon-checkbox").data('price')); 
 
    $(".addon-checkbox").attr('data-price', dataPrice * 3); 
 
    console.log($(".addon-checkbox").attr('data-price')); 
 
    } else { 
 
    $(".addon-checkbox").data('price'); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="pa_size" class="" name="attribute_pa_size" data-attribute_name="attribute_pa_size"> 
 
    <option value="" selected="selected">Válassz egy lehetőséget</option> 
 
    <option value="32cm-normal" class="attached enabled">32 cm (normál)</option> 
 
    <option value="52cm-csaladi" class="attached enabled">52 cm (családi)</option> 
 
</select> 
 
<input type="checkbox" class="addon addon-checkbox" name="addon-4851-husok-2[]" data-raw-price="250" data-price="250" value="sonka">

Answer 2

Zuerst habe ich

$(#pa_size).on('change',function() 

Dann nicht verwenden val(), verwenden Daten wie diese verwenden würde:

$(".addon-checkbox").data('price', value*3) 

Ihre Funktion sollte wie folgt aussehen:

$('#pa_size').on('change',function() { 

    if($("#pa_size").val()=="32cm-normal") { 
     var value = parseFloat($(".addon-checkbox").data('price')); 
     $(".addon-checkbox").data('price', value*3); 
    } 
    else{ 
     $(".addon-checkbox").data('price'); 
    } 
}); 

Answer 3

auf diese Weise versuchen:

var valRawPrice = parseFloat($(".addon-checkbox").data('raw-price')); 
var valPrice = parseFloat($(".addon-checkbox").data('price')); 

nun weiter verwenden diese 2 varaiables heißt valRawPrice & valPrice und die weitere Vermehrung tun. Bitte stimme ab, wenn die Lösung hilfreich ist.

Vielen Dank!