2013-10-19 96 views
1

我目前有一系列針對不同項目的複選框,選中時會修改總數。 JavaScript代碼如下。如何將具有不同輸入名稱的選定複選框相加

<script type="text/javascript"> 
function checkTotal() { 
document.listForm.total.value = ''; 
var sum = 0.00; 
for (i=0;i<document.listForm.choice.length;i++) { 
if (document.listForm.choice[i].checked) { 
sum = sum + parseFloat(document.listForm.choice[i].value); 
} 
} 
document.listForm.total.value = sum.toFixed(2); 
} 

</script> 

此代碼工作正常,但所有複選框具有相同的輸入名稱「選擇」。我需要改變它,以便每個輸入名稱不同,例如choice1,choice2,choice3等。如何更改JavaScript以合併所有不同名稱的複選框,而不是僅添加名爲「choice」的複選框。

希望得到任何幫助,良好的HTML和CSS知識,但非常基本的JavaScript。謝謝。

回答

0

使用jQuery,下面的代碼片段將添加頁面上的所有複選框值。 我沒有測試過這個,但它應該可以工作。

$("input[type=checkbox]").each(function(){ 
    if(this.checked){ 
    sum = sum+this.val(); 
    } 
}); 
1

你可以這樣做:

function checkTotal() { 
    document.listForm.total.value = ''; 
    var sum = 0.00; 
    var i, inputs, input; 

    inputs = document.getElementsByTagName('input') 

    for (i=0;i<inputs.length;i++) { 
     input = inputs[i] 
     if (input.type === 'checkbox' && input.name.substr(0, 6) === 'choice') { 
      sum = sum + parseFloat(input.value); 
     } 
    } 
    document.listForm.total.value = sum.toFixed(2); 
} 

這不是測試,但代碼看起來應該通過DOM的所有輸入元素。然後它將遍歷它們並檢查那些也是以「choice」開頭的複選框。然後它會將複選框的值添加到總和中。

像jQuery這樣的庫讓這類東西變得更容易。

+0

感謝您的迴應,總不會與此代碼相加。不知道爲什麼,它只是保持在0.00的初始值。 – user2890036

+0

還有什麼想法?將非常感謝! – user2890036

+0

我對代碼做了一些修改。我認爲它現在會起作用。如果沒有,請發佈HTML和控制檯中的任何錯誤。您可以按照https://developers.google.com/chrome-developer-tools/docs/console中的說明在Chrome中訪問控制檯 –

相關問題