Eine Variable von einer Funktion abrufen und sie in einem Ereignis ausführen

Question

Ich habe eine Funktion, in der der Preis berechnet wird. Die Variable totalPrice berechnet die Summe einer Auswahl. Ich schreibe dann totalPrice an ein div.

Mein Problem ist, dass ich ein Änderungsereignis auf den Körper ausführen und ich versuche, die calcTotalPrice Funktion innerhalb des Change-Ereignisses auszuführen und dann versuchen, auf die totalPrice Variable zuzugreifen, aber es gibt mir die Variable nicht definierten Fehler.

Wie kann ich die angepasste totalPrice Variable von meiner Funktion erhalten und in einem Ereignis ausführen?

function calcTotalPrice() { 
     var totalPrice = 0; 
     var discountPrice = 0; 

     if (package1.is(':checked') && package2.is(':checked')) { 
      $('.calendar-check:checked').each(function() { 
       var calSoloPrice = ($(this).data('solo-price')); 
       var calCombinedPrice = ($(this).data('combined-price')); 
       totalPrice += parseInt($(this).data('combined-price')); 
       discountPrice += calSoloPrice - calCombinedPrice; 
      }); 
      $('.tp-pack-check:checked').each(function() { 
       var tpSoloPrice = ($(this).data('solo-price')); 
       var tpCombinedPrice = ($(this).data('combined-price')); 
       totalPrice += parseInt($(this).data('combined-price')); 
       discountPrice += tpSoloPrice - tpCombinedPrice; 
      }); 
      $('#package-review-savings').html("<div class='discountMed'>You will be saving $" + discountPrice + " per order by bundling your product package.</div>"); 
     } 
     else { 
      if (package1.is(':checked')) { 
       $('.calendar-check:checked').each(function() { 
        totalPrice += parseInt($(this).data('solo-price')); 
       }); 
      } 
      if (package2.is(':checked')) { 
       $('.tp-pack-check:checked').each(function() { 
        totalPrice += parseInt($(this).data('solo-price')); 
       }); 
      } 
     } 
     $('#package-review-total').html("$" + totalPrice); 
    }; 
$('body').on('change', function() { 
     calcTotalPrice(); 
     console.log("Total Price" + totalPrice); 
}); 

Answer 1

Sie haben die Variable innerhalb der Funktion definiert. Dann existiert es nur auf diesem Bereich.

Wenn Sie die var aus der Definition entfernen, könnten Sie global zugreifen (obwohl ich dies nicht dringend empfehlen).

Die bessere Strategie wäre, um Ihre Funktion den berechneten Wert zurück:

function calcTotalPrice() { 
    var totalPrice = 0; 
    var discountPrice = 0; 

    if (package1.is(':checked') && package2.is(':checked')) { 
     $('.calendar-check:checked').each(function() { 
      var calSoloPrice = ($(this).data('solo-price')); 
      var calCombinedPrice = ($(this).data('combined-price')); 
      totalPrice += parseInt($(this).data('combined-price')); 
      discountPrice += calSoloPrice - calCombinedPrice; 
     }); 
     $('.tp-pack-check:checked').each(function() { 
      var tpSoloPrice = ($(this).data('solo-price')); 
      var tpCombinedPrice = ($(this).data('combined-price')); 
      totalPrice += parseInt($(this).data('combined-price')); 
      discountPrice += tpSoloPrice - tpCombinedPrice; 
     }); 
     $('#package-review-savings').html("<div class='discountMed'>You will be saving $" + discountPrice + " per order by bundling your product package.</div>"); 
    } 
    else { 
     if (package1.is(':checked')) { 
      $('.calendar-check:checked').each(function() { 
       totalPrice += parseInt($(this).data('solo-price')); 
      }); 
     } 
     if (package2.is(':checked')) { 
      $('.tp-pack-check:checked').each(function() { 
       totalPrice += parseInt($(this).data('solo-price')); 
      }); 
     } 
    } 
    $('#package-review-total').html("$" + totalPrice); 
    return totalPrice; 
}; 
$('body').on('change', function() { 
    var totalPrice = calcTotalPrice(); 
    console.log("Total Price" + totalPrice); 
});