Wie zusätzlich zu zwingen, statt Verkettung in Javascript

Question

Ich versuche, all die Kalorien-Inhalte in meinem Javascript wie folgt hinzuzufügen:

$(function() { 
    var data = []; 

    $("#draggable1").draggable(); 
    $("#draggable2").draggable(); 
    $("#draggable3").draggable(); 

    $("#droppable_box").droppable({ 
     drop: function(event, ui) { 
      var currentId = $(ui.draggable).attr('id'); 
      var total = 0; 
      data.push($(ui.draggable).attr('id')); 

      if(currentId == "draggable1"){ 
      var myInt1 = parseFloat($('#MealplanCalsPerServing1').val()); 
      } 
      if(currentId == "draggable2"){ 
      var myInt2 = parseFloat($('#MealplanCalsPerServing2').val()); 
      } 
      if(currentId == "draggable3"){ 
      var myInt3 = parseFloat($('#MealplanCalsPerServing3').val()); 
      } 
     if (typeof myInt1 === 'undefined' || !myInt1) { 
     myInt1 = parseInt(0); 
     } 
     if (typeof myInt2 === 'undefined' || !myInt2){ 
     myInt2 = parseInt(0); 
     } 
     if (typeof myInt3 === 'undefined' || !myInt3){ 
     myInt3 = parseInt(0); 
     } 
     total = parseFloat(myInt1 + myInt2 + myInt3); 
     $('#response').append(total); 
     } 
    }); 
    $('#myId').click(function(event) { 
     $.post("process.php", ({ id: data }), function(return_data, status) { 
      alert(data); 
      //alert(total); 
     }); 
    }); 
}); 

Statt Addieren der Variablen sie verketteten bekommen. Ich habe versucht, parseInt, parseFloat und Number, aber ich bekomme nur noch Verkettung und nicht Addition. Sehen Sie sich die Ansichtsquelle unter http://maureenmoore.com/momp_112412/121912_800.html

an.

Answer 1

Ihr Code verkettet drei Strings und konvertiert dann das Ergebnis in eine Zahl.

Sie müssen jede Variable in eine Zahl umwandeln, indem Sie parseFloat() um jedes anrufen.

total = parseFloat(myInt1) + parseFloat(myInt2) + parseFloat(myInt3); 

Answer 2

Die folgende Anweisung fügt den Wert auf das Element mit der ID von response

$('#response').append(total); 

Dieses es die Saiten sind verketten aussehen wie Sie macht, aber Sie sind nicht, sind Sie eigentlich Anfügen sie das Element

ändern, die

$('#response').text(total); 

Sie müssen das Drop-Ereignis ändern, so dass sie den Wert des Elements mit dem Gesamt ersetzt, müssen Sie auch den Überblick behalten, was die Gesamt ist, schlage ich vor, so etwas wie die folgenden

$(function() { 
    var data = []; 
    var total = 0; 

    $("#draggable1").draggable(); 
    $("#draggable2").draggable(); 
    $("#draggable3").draggable(); 

    $("#droppable_box").droppable({ 
     drop: function(event, ui) { 
     var currentId = $(ui.draggable).attr('id'); 
     data.push($(ui.draggable).attr('id')); 

     if(currentId == "draggable1"){ 
      var myInt1 = parseFloat($('#MealplanCalsPerServing1').val()); 
     } 
     if(currentId == "draggable2"){ 
      var myInt2 = parseFloat($('#MealplanCalsPerServing2').val()); 
     } 
     if(currentId == "draggable3"){ 
      var myInt3 = parseFloat($('#MealplanCalsPerServing3').val()); 
     } 
     if (typeof myInt1 === 'undefined' || !myInt1) { 
      myInt1 = parseInt(0); 
     } 
     if (typeof myInt2 === 'undefined' || !myInt2){ 
      myInt2 = parseInt(0); 
     } 
     if (typeof myInt3 === 'undefined' || !myInt3){ 
     myInt3 = parseInt(0); 
     } 
     total += parseFloat(myInt1 + myInt2 + myInt3); 
     $('#response').text(total); 
     } 
    }); 

    $('#myId').click(function(event) { 
     $.post("process.php", ({ id: data }), function(return_data, status) { 
      alert(data); 
      //alert(total); 
     }); 
    }); 
}); 

ich die var total = 0; bewegte Anweisung aus dem Drop-Ereignis und geändert, um die Zuordnung statment von diesem

total = parseFloat(myInt1 + myInt2 + myInt3); 

dieser

total += parseFloat(myInt1 + myInt2 + myInt3); 

ist hier ein Arbeits EXA mple http://jsfiddle.net/axrwkr/RCzGn/

Answer 3

Sollte auch in der Lage sein, dies zu tun:

total += eval(myInt1) + eval(myInt2) + eval(myInt3); 

Das half mir in einer anderen, aber ähnlichen Situation.