2013-01-30 4 views
0

값의 합계를 계산하는 방법을 아는 사람이 있습니까? 그리고 저는 그 총계에 1072를 곱하고 싶습니다. 하지만 그걸로 잘 작동하지 않았다.합계 값 radiobuttons javascript

그래서 나는 표시되는 4 개의 값의 합계가 계산 될 자바 스크립트 코드를 원한다. 다음

<html> 
    <head> 
     <h2>Inboedelwaardemeter</h2> 
     <script type="text/javascript"> 
      function sumCheckedRadioButtons() { 
        var sum = 0; 
        $('input[type=radio]:checked').each(function(i, el) { 
        sum += Number($(el).val()); 
        }); 
        return sum; 
       } 
       $('#show_sum').on('click', function() { 
        alert(sumCheckedRadioButtons()); 
       }); 
     </script> 
    </head> 
    <body> 
     <br> 
     <b> Leeftijd hoofdkostwinner:</b> 
     <form name="mijnForm1"> 
     <br> 
      <input type="radio" id="getal1" name="leeftijd" 
       value="22" checked> 35 jaar en jonger 
       <br>  
      <input type="radio" id="getal2" name="leeftijd" 
       value="29"> 36 t/m 50 jaar 
       <br> 
      <input type="radio" id="getal3" name="leeftijd" 
       value="38"> 51 jaar en ouder 
       <br> 
      <br> 
     <b> Samenstelling huishouden:</b> 
     <br> 
     <form name="mijnForm2"> 
      <input type="radio" id="getal4" name="huishouden" 
       value="22" checked> Alleenstaande 
       <br>  
      <input type="radio" id="getal5" name="huishouden" 
       value="29"> Echtpaar/Samenwonende 
       <br> 
       <br> 
     <b> Netto maandinkomen hoofdkostwinner</b> 
     <br> 
     <form name="mijnForm3"> 
      <input type="radio" id="getal6" name="hoofdkostwinner" 
       value="22" checked> Tot en met €1000,- 
       <br>  
      <input type="radio" id="getal7" name="hoofdkostwinner" 
       value="29"> €1001,- tot en met €2000,- 
       <br> 
      <input type="radio" id="getal8" name="hoofdkostwinner" 
       value="38"> €2001,- tot en met €3000,- 
      <br> 
      <input type="radio" id="getal9" name="hoofdkostwinner" 
       value="38"> €3001,- of hoger 
      <br> 
      <br> 
      <b> Oppervlakte woning</b> 
      <br> 
     <form name="mijnForm4"> 
      <input type="radio" id="getal10" name="Oppervlakte" 
       value="22" checked> tot en met90m² 
       <br>  
      <input type="radio" id="getal1" name="Oppervlakte" 
       value="29"> 91m² tot en met 140m² 
       <br> 
      <input type="radio" id="getal12" name="Oppervlakte" 
       value="38"> 141m² tot en met 190m² 
      <br> 
      <input type="radio" id="getal13" name="Oppervlakte" 
       value="38"> 191m² of meer 
      <br> 
     </form> 
     <input type="button" id="show_sum" value="Show Sum" /> 
    </body> 
</html> 
+0

양식의 전체가 아닌 입력 값을 계산해야합니다. –

답변

1

바닐라 JS 솔루션입니다 :

function checkTotal() { 
    var a = document.querySelectorAll('input:checked'); 
    var total = 0; 
    for(var x=0; x < a.length;x++){ 
     total += a[x].value * 1; 
    } 
    alert(total); 
} 

참고 : http://jsfiddle.net/2eU4E/1/

2

jQuery를 사용하면 사용 : queryselector은 http://caniuse.com/queryselector

예 여기에 (상대적으로) 최신 브라우저에서 사용할 수 있습니다 확인 된 모든 라디오 버튼을 선택하고 합계에 숫자 값을 더할 수 있습니다 :

function sumCheckedRadioButtons() { 
    var sum = 0; 
    $('input[type=radio]:checked').each(function(i, el) { 
    sum += Number($(el).val()); 
    }); 
    return sum; 
} 

여기는 working jsFiddle입니다 (결과 창 하단의 "합계보기"버튼을 누르십시오).

+0

링크에서 작동합니다. 하지만 코드에 붙여 넣으면 더 이상 작동하지 않습니다 ... 위의 코드를 살펴보십시오. 내가 뭘 잘못했는지 알아? – warnerst

+0

@warnerst : "script"엘리먼트를 HTML 페이지의 가장 아래쪽으로 이동하거나 DOM 준비 핸들러 (예 :'$ (function() {...}) '로 래핑 해보십시오. 버튼이 존재하기 전에 클릭 핸들러를 "show_sum"버튼에 연결하십시오! – maerics

+1

@warnerst jQuery를 사용하고 있습니까? –