Quelle est la meilleure façon de combiner et d'évaluer les entrées de l'utilisateur via javascript?

Question

Je fais plusieurs modules qui nécessitent une entrée de l'utilisateur et je veux en quelque sorte combiner l'entrée pour produire une sortie. Je pensais attribuer une valeur à chaque option et les ajouter ensemble et créer une instruction if/else pour déterminer la sortie ...
Par exemple, si l'utilisateur sélectionne trois options avec les valeurs 1, 2, 3 et l'instruction dit que toute valeur combinée supérieure à 5 obtiendra un résultat de "Bon", alors les options sélectionnées obtiendront une réponse de "Bon" car lorsqu'elles sont combinées, elles sont égales à 6 (qui est> 5). Est-ce que quelqu'un connaît un meilleur moyen, et/ou pouvez-vous me diriger vers des sites de référence qui pourraient avoir ce que je cherche?

Merci beaucoup! Toute aide est appréciée !!

Answer 1

Vous cherchez quelque chose comme ceci?

<form id="module1"> 
    <input name="option1" type="checkbox" value="Orange"> Orange 
    <input name="option2" type="checkbox" value="Banana"> Banana 
    <input name="option3" type="checkbox" value="Apple"> Apple 
    <input name="option4" type="checkbox" value="Mango"> Mango 
    <input name="option5" type="checkbox" value="Pineapple"> Pineapple 
</form> 
<button id="evaluate" type="button">Evaluate</button> 
<h4 id="result"></h4> 
<h5 id="values"></h5> 

<script type="text/javascript"> 
    $(document).ready(function() { 

     var scoreConstants = { 
      'Mango': 100, 
      'Banana': 100, 
      'Pineapple': 200, 
      'Orange': 50, 
      'Apple': 250 
     }; 

     var evalScore = function (selectedValues) { 
      var totalScore = 0; 
      $.each(selectedValues, function (k, v) { 
       totalScore += scoreConstants[v]; 
      }); 
      return totalScore; 
     } 

     var getScoreLabel = function (score) { 
      var scoreValue = 'Score: '; 
      if (score < 200) { 
       scoreValue += 'Average'; 
      } else if (score >= 200 && score < 500) { 
       scoreValue += 'Good'; 
      } else if (score >= 500) { 
       scoreValue += 'Excellent!'; 
      } 
      return scoreValue; 
     } 


     $('body').on('click', '#evaluate', function (e) { 
      var $selectedValues = $('#module1').find('input:checked'); 
      var selectedValues = []; 
      $selectedValues.each(function (k, v) { 
       var $selected = $(v); 
       selectedValues.push($selected.val()); 
      }); 

      var score = evalScore(selectedValues); 
      var scoreLabel = getScoreLabel(score); 

      var valueString = 'Selected: '; 
      if (selectedValues.length > 0) { 
       $.each(selectedValues, function (k, v) { 
        if (k === (selectedValues.length - 1)) { 
         valueString += v; 
        } else { 
         valueString += v + ', ' 
        } 
       }); 
      } else { 
       valueString += 'None'; 
      } 

      var $result = $('#result'); 
      $result.html(scoreLabel); 

      var $displayValues = $('#values'); 
      $displayValues.html(valueString); 

     }); 
    }); 
</script> 

Voir le code de travail ici: https://jsfiddle.net/0x2L0dek/1

Answer 2

Je pense que vous êtes à la recherche de ceci. Pour voir le résultat, vérifiez votre console.

<input type="checkbox" class="chk" value=1>1</input><br> 
<input type="checkbox" value=2 class="chk">2</input><br> 
<input type="checkbox" value=3 class="chk">3</input><br> 
<input type="checkbox" value=4 class="chk">4</input><br> 

<button id="button1" onclick="checkSum()">Submit</button> 

<script> 
function checkSum(){ 
var chk = document.getElementsByClassName('chk'); 

sum = 0; 
for(var i=0; chk[i]; ++i){ 
     if(chk[i].checked){ 
      sum = sum + parseInt(chk[i].value); 
     } 
} 

console.log(sum); 
if(sum > 5){ 
console.log("Good"); 
} 
} 
</script>