Wie man einen Score/Wert basierend auf den in einem Formular mit jQuery ausgewählten Optionen akkumuliert

Question

Ich möchte versuchen zu erforschen, wie man das erreicht, aber ich bin mir nicht sicher, wie man die Lösung dafür macht.

Grundsätzlich habe ich ein Formular, das einige Auswahlliste, Optionsfelder und Kontrollkästchen enthält. Jede Option auf dem Formular hat einen entsprechenden numerischen Wert, der gesammelt und dem Benutzer angezeigt wird, wenn das Formular gesendet wird.

Worüber ich mir nicht sicher bin, ist, wie man einen Wert hinzufügen oder abziehen kann, wenn der Benutzer die Auswahl im Formular ändert.

Wenn zum Beispiel ein Benutzer auf dem ersten Dropdown-Element ist und Option 2 mit einem Wert von 5 ausgewählt wird, dann wird der aktuelle Akkumulationswert Us 5. Dann wählen Sie in Frage 2 die Option 1 mit einem Wert von Der Benutzer ändert dann die Antwort für Frage eins von Option 2 auf Option eins, was bedeutet, dass 5 von dem akkumulierten Wert abgezogen wird und 2 addiert wird, da es der Wert für Option 1 ist, der die akkumulierten Werte ändert Wert auf 4.

Ich kenne die Beschreibung, die ich erwähnte, könnte überall sein, aber ich hoffe, dass es Sinn macht.

ich jQuery zu verwenden bin versucht, und so weit, wäre mein Ansatz zu prüfen sein, ob einer der Wert des Formularelement hat sich geändert:

(function($) { 
    var score = 0; 
    $(".the-form #step-5 :input").change(function() { 
     console.log($(this).val()); 
    }); 
})(jQuery); 

Aber ich kann nicht scheinen, um herauszufinden, wie das bekommen vorheriger Wert der Option, die ausgewählt wurde, wenn der Benutzer seine Antwort ändert.

Jeder Vorschlag wäre willkommen.

Answer 1

Können Sie jedes Mal, wenn der Benutzer eines der Elemente ändert, das gesamte Formular neu berechnen?

$(".the-form :input").change(calculateChanges); 

function calculateChanges() { 
    // Retrieve the current values of all elements and add them together 
} 

Answer 2

Wenn ein Benutzer sendet, dann beginnen Sie mit den Berechnungen oder wenn eine Auswahl geändert wird, d. H. An das Ereignis anhängen. Score ist jetzt eine lokale Variable

function calcValue() { 
    var score = 0; 

    //select all the elements using example below 
    $(".the-form :input").each(function(index) { 
    //i forgot jQuery exact syntax but $(this).val or //$(this).val() 
     score += $(this).val(); 
    }); 
    console.log(score); 
} 

In diesem Fall, dass Sie es auf den Absenden anhängen

function submit() { 
    var score = calcValue(); 
} 

Oder Sie können es in einem Änderungsereignis eines select

function selectChanged() { 
    var score = calcValue(); 
}