Получите сумму значения переключателя с помощью функции javascript в таблице

-1

Я ищу, чтобы получить сумму этих 4 разных значений без запроса через переключатели. Здесь мой javascript и html, как только я нажимаю на submit, 0 появляется в общем поле, спасибо за вашу помощь!Получите сумму значения переключателя с помощью функции javascript в таблице

<!DOCTYPE html> 
<html> 

<body> 

<script>  
function checkRadio() { 
var selectedAge=""; 
var selectedBmi=""; 
var selectedDiabete=""; 
var description=""; 
var len = document.row.length; 
var i; 

function init(){ 
for (i = 0; i<len; i++) { 
    if (document.row[i].value); 
    break; 
} 

if (selectedAge == "") { 
    document.getElementByid("radio_error").innnerHTML = "no option  selected"; 
    return false 
} 
else { 
     document.getElementById("radio_error").innerHTML = ""; 
     return true; 
} 

} 
init(); 

} 

</script> 


<script> 
function addNumbers() 
      { 
     var val1 = parseInt(document.getElementById("value1").value); 
     var val2 = parseInt(document.getElementById("value2").value); 
     var val3 = parseInt(document.getElementById("value3").value); 
     var val4 = parseInt(document.getElementById("value4").value); 
     var ansD = document.getElementById("answer"); 
     ansD.value = val1 + val2 + val3 + val4; 
      } 
</script> 

    <table> 

         <tr> 
          <th scope="col"></th> 
          <th scope="col">noRisk</th> 
          <th scope="col">lowRisk</th> 
          <th scope="col">mediumRisk</th> 
          <th scope="col">HighRisk</th> 
         </tr> 
         <tr> 
          <th scope="row"><div class="lefttext">How old are you?</div></th> 

          <td><input type="radio" id="value1" name="selectedAge" onclick="addNumber(val1)" value="0"checked>1-25</td> 
          <td><input type="radio" id="value1" name="selectedAge" onclick="addNumber(val1)" value="5">26-40</td> 
          <td><input type="radio" id="value1" name="selectedAge" onclick="addNumber(val1)" value="8">41-60</td> 
          <td><input type="radio" id="value1" name="selectedAge" onclick="addNumber(val1)" value="10">1-25</td> 
         </tr> 

         <tr> 
          <th scope="row"><div class="lefttext">What is you BMI?</div></th> 
          <td><input type="radio" id="value2" name="selectedBmi" onclick="addNumber(val2)" value="0" checked>0-25</td> 
          <td><input type="radio" id="value2" name="selectedBmi" onclick="addNumber(val2)" value="0">26-30</td> 
          <td><input type="radio" id="value2" name="selectedBmi" onclick="addNumber(val2)" value="9">31-35</td> 
          <td><input type="radio" id="value2" name="selectedBmi" onclick="addNumber(val2)" value="10">35+</td> 
         </tr> 
         <tr> 
          <th scope="row"><div class="lefttext">Does anybody in your family have diabetes?</div></th> 
          <td><input type="radio" id="value3" name="selectedDiabete" onclick="addNumber(val3)" value="0" checked>No</td> 
          <td><input type="radio" id="value3" name="selectedDiabete" onclick="addNumber(val3)" value="7">Grandparent</td> 
          <td><input type="radio" id="value3" name="selectedDiabete" onclick="addNumber(val3)" value="15">Sibling</td> 
          <td><input type="radio" id="value3" name="selectedDiabete" onclick="addNumber(val3)" value="15">Parent</td> 
         </tr> 
         <tr> 
          <th scope="row"><div class="lefttext">How would you describe your diabete</div></th> 
          <td><input type="radio" id="value4" name="description" onclick="addNumber(val4)" value="0" checked >Low sugar</td> 
          <td><input type="radio" id="value4" name="description" onclick="addNumber(val4)" value="0">Normal sugar</td> 
          <td><input type="radio" id="value4" name="description" onclick="addNumber(val4)" value="7">Quite high sugar</td> 
          <td><input type="radio" id="value4" name="description" onclick="addNumber(val4)" value="10">High sugar</td> 
         </tr> 
        </table> 
        <input type="button" name="Sumbit" value="Submit" onclick="javascript:addNumbers()"/> 
        Total = <input type="text" id="answer" name="answer" value=""/> 

</body>

источник

2015-07-31 martin

'id' атрибуты должны быть уникальными в пределах HTML-документа. В вашем коде есть и другие недостатки, слишком многие из которых перечислены здесь. –

Вы должны указать, что вы хотите только значение проверяемых флажков. Теперь вы можете выбрать все флажки. Попробуйте это вместо этого:

function addNumbers() 
{ 
    var val1 = parseInt(document.querySelector('input[name = "selectedAge"]:checked').value); 
    var val2 = parseInt(document.querySelector('input[name = "selectedBmi"]:checked').value); 
    var val3 = parseInt(document.querySelector('input[name = "selectedDiabete"]:checked').value); 
    var val4 = parseInt(document.querySelector('input[name = "description"]:checked').value); 
    var ansD = document.getElementById("answer"); 

    ansD.value = val1 + val2 + val3 + val4; 
}

источник

2015-07-31 13:34:34

Спасибо, он отлично работает! – martin

Here рабочий пример.

В основном:

 
var sum = function(a, b) { 
    return a + b; 
}; 
var getPollResult = function() { 
    var checkedRadioButtons = document.querySelectorAll('table input[type="radio"]:checked'); 
    return Array.prototype.map.call(checkedRadioButtons, function(radio) { return parseInt(radio.value, 10); }).reduce(sum, 0); 
}; 
document.getElementById("submit").addEventListener('click', function() { 
    document.getElementById("answer").value = getPollResult(); 
});

источник

2015-07-31 13:41:11

Получите сумму значения переключателя с помощью функции javascript в таблице

ответ

Смежные вопросы