Javascript 如何基于使用jQuery在表单上选择的选项累积分数/值

我想研究一下如何实现这一点，但我不确定如何解决这个问题

基本上，我有一个表单，其中包含一些选择列表、单选按钮和复选框。表单上的每个选项都有一个相应的数值，该数值将在表单提交时累积并显示给用户

我不确定的是，如果用户选择更改表单上的a选项，如何添加或扣除值

例如，当用户位于第一个下拉元素上时，他们选择值为5的选项2，然后选择当前累计值us 5。然后在问题2上，他们选择选项1，该选项的值为2，使累计值为7。然后用户将问题1的答案从选项2更改为选项1，这意味着将从累积值中扣除5，并添加2，因为选项1的值将累积值更改为4

我知道我提到的描述可能到处都是，但我希望它有意义

我正在尝试使用jQuery，到目前为止，我的方法是检查表单元素的值是否已更改：

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

但是，如果用户更改答案，我似乎不知道如何获取所选选项的先前值

---

如果您有任何建议，我们将不胜感激。

您能否在用户每次更改任何元素时重新计算整个表单

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

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

---

当用户提交时，然后开始进行计算，或者当选择被更改时，即将其附加到事件。分数现在是一个局部变量

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);
}

在这种情况下，您可以将其附加到submit

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

或者，您可以将其放在选择的更改事件中

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

---

在用户单击submit之前不要累计分数。如果它是一个表单，您将为提交事件添加一个事件侦听器。在jQuery中这看起来像：

$（“.theform”）.submit（function（event）{}）

，在Javascript中它看起来像：

form.onsubmit=function（event）{}

或

form.addEventListener（'submit'，function（event）{}）

。在JS中，使用类似于

var form=document.querySelector（“.the form”）

的内容获取元素。