Калькулятор JavaScript вычисляет непроверенную ячейку

Я довольно новичок в javascript, и я пытаюсь сделать калькулятор, который мгновенно вычисляет общую стоимость выбранных продуктов.Калькулятор JavaScript вычисляет непроверенную ячейку

Калькулятор работает нормально, но сейчас флажок вычисляется вместе с остальными продуктами, даже если он не установлен. Я пытаюсь сделать так, чтобы, когда он не установлен, значение равно 0, а когда оно отмечено, оно равно 0.50.

Это то, что я до сих пор:

<head>   
    <style type="text/css">                
     .right{ 
      margin-top: 10px; 
      width: 150px; 
      height: 45px; 
      background-color: #66CCFF; 
     } 

     p{ 
      margin: 0; 
      padding: 0; 
     } 
    </style> 

    <script type="text/javascript"> 
    <!-- 
     function calculate() { 

      var A1 = document.getElementById('Amount1').value 
      var A2 = document.getElementById('Amount2').value 
      var A3 = document.getElementById('Amount3').value 

      var PStart = 0;     
      var P1  = A1*1.50; 
      var P2  = A2*1.00; 
      var P3  = A3*1.00; 
      var PTotal = P1+P2+P3; 

      var Insert = document.getElementById("TotalPrice"); 
      TotalPrice.innerHTML= PTotal; 
     } 
    --> 
    </script> 
</head> 

<body onload="calculate()"> 
    <form> 
     <fieldset> 
      <legend>Price</legend> 
      <div class="FormRow"> 
       <label for="Amount2">Console $1,50</label> 
       <input type="text" min=0 id="Amount1" name="Amount1" oninput="calculate()" /> 
      </div> 
      <div class="FormRow"> 
       <label for="Amount2">Controller $1,00</label> 
       <input type="text" min=0 id="Amount2" name="Amount2" oninput="calculate()" /> 
      </div> 
      <div class="FormRow"> 
       <label for="Amount3">Batteries? $0,50</label> 
       <input type="checkbox" value="0.50" id="Amount3" name="Amount3" onchange="calculate()"/> 
      </div> 
      <div class="right" > 
       <p><b>Total price:</b></p> 
       <p id="TotalPrice"> 

       </p> 
      </div> 
     </fieldset> 
    </form> 
</body>

источник

2013-11-21 Paradoxis

Попробуйте это:

var A1 = document.getElementById('Amount1').value 
var A2 = document.getElementById('Amount2').value 
var A3 = document.getElementById('Amount3').checked ? 
    document.getElementById('Amount3').value : 0;

Demo

источник

2013-11-21 17:19:11

Вы можете использовать document.getElementById('Amount1').checked, чтобы проверить, если установлен флажок. Так что ваш код будет выглядеть

var A1 = document.getElementById('Amount1').checked   ? 
     parseFloat(document.getElementById('Amount1').value) : 
     0; 
var A2 = document.getElementById('Amount1').checked   ? 
     parseFloat(document.getElementById('Amount1').value) : 
     0; 
var Total = A1 + A2;

источник

2013-11-21 17:15:52

Калькулятор JavaScript вычисляет непроверенную ячейку

ответ

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