计算多个复选框值

我需要帮助来计算独立表中的每个复选框值。计算多个复选框值

第一示例表：

<table id="847391201"> 
    <tr> 
     <td><input type="checkbox" name="option1" value="49.90" onClick="calculate(this, 847391201);"></td> 
     <td style="text-align: left;">Option 1</td> 
     <td style="text-align: right;">49.90 $</td> 
    </tr> 
    <tr> 
     <td><input type="checkbox" name="option2" value="39.90" onClick="calculate(this, 847391201);"></td> 
     <td style="text-align: left;">Option 2</td> 
     <td style="text-align: right;">39.90 $</td> 
    </tr> 
    <tr> 
     <td><input type="checkbox" name="option3" value="29.90" onClick="calculate(this, 847391201);"></td> 
     <td style="text-align: left;">Option 3</td> 
     <td style="text-align: right;">29.90 $</td> 
    </tr> 
    <tr> 
     <td><input type="checkbox" name="option4" value="19.90" onClick="calculate(this, 847391201);"></td> 
     <td style="text-align: left;">Option 4</td> 
     <td style="text-align: right;">19.90 $</td> 
    </tr> 
    <tr> 
     <td colspan="3" style="text-align: right;">Total: <span id="total_847391201">0.00 $</span></td> 
    </tr> 
    <tr> 
     <td colspan="3" style="text-align: center;"><a href="#" class="button orange">Make Payment</a></td> 
    </tr> 
</table>

第二个例子表：

<table id="847391202"> 
    <tr> 
     <td><input type="checkbox" name="option1" value="49.90" onClick="calculate(this, 847391202);"></td> 
     <td style="text-align: left;">Option 1</td> 
     <td style="text-align: right;">49.90 $</td> 
    </tr> 
    <tr> 
     <td><input type="checkbox" name="option2" value="39.90" onClick="calculate(this, 847391202);"></td> 
     <td style="text-align: left;">Option 2</td> 
     <td style="text-align: right;">39.90 $</td> 
    </tr> 
    <tr> 
     <td><input type="checkbox" name="option3" value="29.90" onClick="calculate(this, 847391202);"></td> 
     <td style="text-align: left;">Option 3</td> 
     <td style="text-align: right;">29.90 $</td> 
    </tr> 
    <tr> 
     <td><input type="checkbox" name="option4" value="19.90" onClick="calculate(this, 847391202);"></td> 
     <td style="text-align: left;">Option 4</td> 
     <td style="text-align: right;">19.90 $</td> 
    </tr> 
    <tr> 
     <td colspan="3" style="text-align: right;">Total: <span id="total_847391202">0.00 $</span></td> 
    </tr> 
    <tr> 
     <td colspan="3" style="text-align: center;"><a href="#" class="button orange">Make Payment</a></td> 
    </tr> 
</table>

的Javascript：

<script type="text/javascript"> 
<!-- 
var total = parseFloat(0.00); 
function calculate(item, id) { 
    if (item.checked) { 
     total += parseFloat(item.value); 
    } else { 
     total -= parseFloat(item.value); 
    } 
    $('span[id="total_' + id + '"]').text(total.toFixed(2) + ' $'); 
} 
//-->

此代码的工作相当不错，但是当我点击了一些选项在第一张桌子上，然后我点击第二张桌子上的另一个选项，它继续计数。我想让这个独立的每个表选项。我将表格，复选框和总跨度与ID分开，但我无法做到这一点，因为我想工作。

非常感谢。

来源

2015-12-15 A. Murat

ID和名称标记必须以字母开头（[A-ZA-Z] ），可以跟随任意数量的字母，数字（[0-9]），连字符（“ - ”），下划线（“_”），冒号（“：”）和句点（“。”），以及如果避免内联事件onclick，并使用'click（）'事件，则更好。 –

您正在将总值存储在一个全局变量中。你可以用数组代替：

var total = new Array(); 
function calculate(item, id) { 
    if (total[id] == undefined) 
     total[id] = parseFloat(0.00); 
    if (item.checked) 
     total[id] += parseFloat(item.value); 
    else 
     total[id] -= parseFloat(item.value); 
    $('span[id="total_' + id + '"]').text(total[id].toFixed(2) + ' $'); 
}

来源

2015-12-15 17:27:49

非常感谢。 –

你需要两个变量才能跟踪两个总数？

var totalTableA = parseFloat(0.00);

var totalTableB = parseFloat(0.00);

然后添加到根据ID相关的总：

function calculate(item, id) { 
if (item.checked) { 
    if(id = 847391202) 
    { 
     totalTableA += parseFloat(item.value); 
    } else { 
     totalTableB += parseFloat(item.value); 
    } 
} else { 
    if(id = 847391202) 
    { 
     totalTableA -= parseFloat(item.value); 
    } else { 
     totalTableB -= parseFloat(item.value); 
    } 
} 
$('span[id="total_' + id + '"]').text(totalTableA.toFixed(2) + ' $'); 
$('span[id="total_' + id + '"]').text(totalTableB.toFixed(2) + ' $');

}

来源

2015-12-15 17:29:17

计算多个复选框值

回答

相关问题