Berechnen Preis ab Menge input box in jQuery

Ich habe da ein kleines Problem, der Berechnung der Preis von der Quantität in jQuery. Das sind die input-Boxen, die ich habe.

Quantity: <input type="text" style="width: 50px;" name="quantity" id="quantity" class="txt" value="1" />

Price: <input type="text" style="width: 50px;" name="item_price" id="item_price" class="txt" value="2990" />

Total Price: <input type="text" style="width: 50px;" name="total_price" id="total_price" class="txt" value="" />
Keine. Es sei denn, Sie erklären, was Sie erreichen wollen. Sollte es sein, ausgehend von der Eingabe des Benutzers? aus der fest programmierte Wert in die Eingabefelder? Sollte das passieren, wenn die Seite geladen ist? On-the-fly? ...

InformationsquelleAutor Jack Johnson | 2012-10-04

  1. 4

    Ich bin angenommen, Sie wollen die Formeln oder wie man die Werte der input-Elemente:

    var quantity = $("#quantity").val();
var iPrice = $("#item_price").val();

var total = quantity * iPrice;

$("#total_price").val(total); //sets the total price input to the quantity * price

alert(total);

    Bearbeiten für Keyup:

    $('#quantity').keyup(function() {
   var quantity = $("#quantity").val();
   var iPrice = $("#item_price").val();

   var total = quantity * iPrice;

   $("#total_price").val(total); //sets the total price input to the quantity * price
});
    Dies funktioniert aber keine live - /keyup-wenn ich die Menge ändern, keine Ahnung ?
    enthalten ist ein keyup Beispiel, wenn die Menge geändert wird. Hoffe, das hilft.
    Danke, aber jetzt ist der Preis wird nicht angezeigt, wenn ich eine änderung in das Feld "Menge", die schnelle Lösung für die ?
    der Preis soll bei erscheinen auf die Seite laden. Check out: jsfiddle.net/WXyNw
    wenn Sie wollte, es zu ändern live dabei, wenn der Preis geändert wird, müssen Sie eine Ereignisprozedur zu verarbeiten, auch dies, und Sie konnte kopieren das keyup-Funktion, die ich für Sie erstellt, und ändern Sie "#" Menge "#item_price"

    InformationsquelleAutor Darren

  2. 2

    aktualisiert anzeigen vollständiges Beispiel in script-tags

    Wenn Sie möchten, dass die Formel und wie Sie "sehen" können das ändern:

    <script type="text/javascript">
    $(function() {  // In jQuery 1.6+ this is same as $(document).ready(function(){})
        $('#quantity, #item_price')  // jQuery CSS selector grabs elements with the ID's "quantity" & "item_price"
            .on('change', function(e) {  // jQuery 1.6+ replcement for .live (dynamically asigns event, see jQuery API)
            // in this case, our event is "change" which works on inputs and selects to let us know when a value is changed
                // below i use inline if statements to assure the values i get are "Real"
                var quan = $("#quantity").val() != "" ? parseFloat($("#quantity").val()) : 1,  // Get quantity value
                    pric = $("#item_price").val() != "" ? parseFloat($("#item_price").val()) : 0;  // Get price value
                $('#total_price').val(pric*quan); //show total
            });
    });
</script>
    Dies ist, wie ich es tun würde. Sie müssen fügen Sie die oben in einer <Script type="text/javascript"> einfach über Ihren </body> Abschnitt.. Nur im Fall es ist offensichtlich nicht zu OP
    konkret diese Nutzung .on ist nicht der Ersatz für live.. müssen Sie das delegieren version, die $(staticparent).on('events','elements',function()

    InformationsquelleAutor SpYk3HH

Schreibe einen Kommentar