複選框計算不工作

Question

嗨我有一個計算複選框和實時所以在這裏總的問題是我的代碼：

function calc() 

{ 
    theTotal = 0; 
    checkForm = document.FormName; 
    for (i=0; i <= checkForm.length-1; i++) { 
     if (checkForm.elements[i].type == "checkbox") { 
      if (checkForm.elements[i].checked == true) { 
       document.getElementById("total").value = theTotal; 
      } 
     } 
    } 
    document.getElementById("total").innerHTML = theTotal; 
} 

這裏是我的html代碼：

<p>Total: $<span id="total">0</span></p> 

    <tr> 
    <td> <br> <center> <img src="Shirt1.jpg" width="160" height="150" alt="shirt1"> <br> <input type="checkbox" onchange="calc()" value="19.99"> <label for="rd1">Obey T-Shirt: $19.99</label> </center> </br></td> 
    <td> <br> <center> <img src="Shoe1.jpg" width="160" height="150" alt="shoe1"> <br> <input type="checkbox" onchange="calc()" value="19.99"> <label for="rd1">Shoe - Red Lace: $19.99</label> </center> </br> </td> 
    <td> <br> <center> <img src="Snapback1.jpg" width="160" height="150" alt="snap1"> <br> <input type="checkbox" onchange="calc()" value="19.99"> <label for="rd1">Snapback Bullets: $19.99</label> </center> </br> </td> 
</tr> 

當我點擊其中一個選中的複選框，它不會給我所需的計算。你能幫助我嗎？

Answer 1

有很多問題似乎在代碼中.value的。在這裏我寫給你更簡單。

即使您使用每個複選框單獨調用它，也不需要遍歷每個表單元素。

您還需要將theTotal作爲全局變量來檢查項目總數。現在你在每次函數調用時將它重置爲0。

你可以試試這個

var theTotal = parseFloat(0); 

function calc(control) { 
    if (control.checked == true) { 
     theTotal += parseFloat(control.value); 
    } else { 
     theTotal -= parseFloat(control.value); 
    } 
    document.getElementById("total").innerHTML = theTotal; 
} 

，並調用它

<input type="checkbox" onchange="calc(this)" value="19.99"> 

JS Fiddle Demo

Answer 2

您沒有更新變量總數。

你應該閱讀的檢查輸入