2015-11-05 1 views
1

J'ai quelques éléments de produit avec un prix de base et un prix supplémentaire. L'objectif est d'ajouter le prix supplémentaire au prix de base et de remplacer le prix de base par le prix nouvellement calculé. Ci-dessous le code que j'ai jusqu'à présent, le fichier console.logs me donne tous les bons commentaires, mais le prix ne s'ajoutera pas à la div .subtotal, peu importe ce que j'essaie.jQuery Append ne fonctionne pas avec parseInt var

jQuery(document).ready(function() { 
 

 
    var extra = jQuery('.extra'); 
 
    extra.each(function() { 
 
    var $this = jQuery(this).html().replace(/[^\d,]/g, ''); 
 

 
    var subtotal_dest = jQuery(this).siblings('.subtotal'); 
 
    jQuery(subtotal_dest).css('border', '2px solid green'); 
 

 
    var subtotal = jQuery(this).siblings('.subtotal').html().replace(/[^\d,]/g, ''); 
 

 
    var newtotal = parseInt($this) + parseInt(subtotal); 
 
    var rendered_total = '€ ' + newtotal; 
 

 
    jQuery(rendered_total).appendTo(subtotal_dest); 
 

 
    console.log($this); 
 
    console.log(subtotal); 
 
    console.log(rendered_total); 
 
    console.log('-'); 
 
    }); 
 

 
});
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js'></script> 
 
</head> 
 

 
<body> 
 

 
    <div class="product" style="margin-bottom:20px;"> 
 
    <!--subtotal should be €10 --> 
 
    <div class="subtotal">€ 5,00</div> 
 
    <div class="extra">€ 5,00</div> 
 
    </div> 
 
    <div class="product" style="margin-bottom:20px;"> 
 
    <!--subtotal should be €20--> 
 
    <div class="subtotal">€ 15,00</div> 
 
    <div class="extra">€ 5,00</div> 
 
    </div> 
 
    <div class="product" style="margin-bottom:20px;"> 
 
    <!--subtotal should be €30--> 
 
    <div class="subtotal">€ 25,00</div> 
 
    <div class="extra">€ 5,00</div> 
 
    </div> 
 

 
</body> 
 

 
</html>

+0

Qu'est-ce qui est supposé atteindre 'jQuery (rendered_total)'? –

+0

Juste un moyen d'ajouter le signe Euro dans le total nouvellement calculé. –

Répondre

1

$('€ ' + newtotal') ne fait rien utile.

Remplacer

jQuery(rendered_total) 

avec

jQuery("<div>").text(rendered_total). 

complet Code de Runnable:

jQuery(document).ready(function() { 
 

 
    var extra = jQuery('.extra'); 
 
    extra.each(function() { 
 
    var $this = jQuery(this).html().replace(/[^\d,]/g, ''); 
 

 
    var subtotal_dest = jQuery(this).siblings('.subtotal'); 
 
    jQuery(subtotal_dest).css('border', '2px solid green'); 
 

 
    var subtotal = jQuery(this).siblings('.subtotal').html().replace(/[^\d,]/g, ''); 
 

 
    var newtotal = parseInt($this) + parseInt(subtotal); 
 
    var rendered_total = '€ ' + newtotal; 
 

 
    jQuery("<div>").text(rendered_total).appendTo(subtotal_dest); 
 

 
    console.log($this); 
 
    console.log(subtotal); 
 
    console.log(rendered_total); 
 
    console.log('-'); 
 
    }); 
 

 
});
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js'></script> 
 
</head> 
 

 
<body> 
 

 
    <div class="product" style="margin-bottom:20px;"> 
 
    <!--subtotal should be €10 --> 
 
    <div class="subtotal">€ 5,00</div> 
 
    <div class="extra">€ 5,00</div> 
 
    </div> 
 
    <div class="product" style="margin-bottom:20px;"> 
 
    <!--subtotal should be €20--> 
 
    <div class="subtotal">€ 15,00</div> 
 
    <div class="extra">€ 5,00</div> 
 
    </div> 
 
    <div class="product" style="margin-bottom:20px;"> 
 
    <!--subtotal should be €30--> 
 
    <div class="subtotal">€ 25,00</div> 
 
    <div class="extra">€ 5,00</div> 
 
    </div> 
 

 
</body> 
 

 
</html>

+0

Je vois, merci. Cela marche! Mais je me demande pourquoi il doit apparemment être «texte». Je pensais que la variable 'rendered_total' était déjà une chaîne de texte. –