Bonjour,
Je travaille sur un exercice qui consiste à renseigner des champs crées dynamiquement avec les données de champs div et fait le total d'une div qui contient les prix.
Mais je suis confronté à deux problème :
1 - Lorsque je fais un click sur le lien le champ input est crée deux fois ;
2 - j'ai une erreur de récursivité de la fonction total :Code htmlUncaught InternalError: too much recursion
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23 <div class="col-lg-12 col-md-7 col-12"> <div class="container"> <div class="row"> <article class="col-lg-4 col-sm-6 col-md-4 col-12"> <div class="food-item" id="food-item"> <div class="inner-content"> <div class="food-simg"><img src="photos/alloco.jpg" alt="alloco" class="img-fluid" /></div> <div class="food-desc" id="food-desc"> <div class="food-name" id="food-name"> <img src="#" alt="" class="img-fluid"/> <h4 class="title">Alloco abidjanais</h4> </div> <div class="food-price col-lg-9 col-xs-9" id="prix"> <div id="prix" style="display: inline-block;">1500</div><sup>FCFA</sup></div> <div class="food-add col-lg-3 col-xs-3 offset-9"><a href="#">+</a></div> </div> </div> </div> </article> </div> </div> </div>
Code JQuery
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45 $(document).ready(function(){ $("article").on("click",".food-add>a", function(e){ e.preventDefault(); var $article = $(this).closest("article"), nomMenu = $article.find("#food-name>h4").html(), prix = $article.find("#prix>div").html(); var $input = $('<input type="text" name="menu" size="31" value="'+nomMenu+'"><input type="text" name="prix" size="10" value="'+prix+'">'); console.log($input); $input.html(nomMenu+" "+prix+" FCFA").appendTo($(".listeCmd")); $("#prixSelection").css("textAlign", "right"); TotalCommande(); //Appel de la fonction claculer le total de la commande }); $("#itemChoix").on("click","li",function(){ var $this = $(this); $this.addClass("removing").slideUp(function(){ $this.remove(); TotalCommande(); //Appel de la fonction reclaculer le total de la commande après la suppression d'un menu }); }); function TotalCommande(){ var $prixTotal = 0; //initialisation du total commande à 0 $(".listeCmd").each(function(){ var $prix = $(this).html; $prixTotal += parseInt($prix); }); if ($prixTotal == undefined){ $prixTotal=0; } var $boxTotal = $('<div id="#totalcommande"></div>'); $boxTotal.html(TotalCommande()+" FCFA"); }; });
Partager