我有一个包含数据库查询生成的值的列表。 我希望看到用户选择的值的总和(通过复选框)。
复选框代码:
<?php
$i = -1;
while ($row = mysql_fetch_array($res))
{
$i++;
?>
echo '<table>
<tr>
<td><input type="checkbox" onclick="bedrag_optellen(this, <?php echo $i ?>);" value= "'.$row['bedrag_incl'].'"></td>
<td>€ '.number_format($row['bedrag_incl'], 2, ',', ' ').'</td>
</tr>
</table>';
}
?>
输出字段代码:
<table>
<tr>
<td width="51"><input type="text" id="bedragen_selected" name="bedragen_selected" value="" size="10" style="text-align:right;background-color: #e7e7e9" readonly="readonly" /></td>
</tr>
</table>
的JavaScript
<script type="text/javascript"</script>
function bedrag_optellen(checkbox, nr)
{
var i, totaal = 0;
var elems = document.getElementsByName('bedrag_optellen[]');
var l = elems.length;
for(i=0; i<l; i++)
{
if(formElement['bedrag_optellen[]'][i].checked = true)
{
totaal += parseFloat(elems[i].value) || 0;
}
document.getElementById('bedragen_selected').value = totaal.toFixed( 2 );
}
}
</script>
代码不起作用,也没有给出错误。
有没有人帮助我?
答案 0 :(得分:1)
查看此fiddle。
我使用jQuery是为了它提供的简单性。
我做了以下更改:
cost
。onClick
属性。要使代码在您的系统中运行,请将以下代码添加到<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
以下是摘录。
<强> HTML 强>
<table>
<tr>
<td><input class='cost' type="checkbox" value= "8"></td>
<td>€ 8</td>
</tr>
<tr>
<td><input class='cost' type="checkbox" value= "3"></td>
<td>€ 3</td>
</tr>
<tr>
<td><input class='cost' type="checkbox" value= "19"></td>
<td>€ 19</td>
</tr>
<tr>
<td><input class='cost' type="checkbox" value= "2"></td>
<td>€ 2</td>
</tr>
<tr>
<td><input class='cost' type="checkbox" value= "15"></td>
<td>€ 15</td>
</tr>
<tr>
<td><input class='cost' type="checkbox" value= "12"></td>
<td>€ 12</td>
</tr>
</table>
<table>
<tr>
<td width="51"><input type="text" id="bedragen_selected" name="bedragen_selected" value="" size="10" style="text-align:right;background-color: #e7e7e9" readonly="readonly" /></td>
</tr>
</table>
<强> JS 强>
var sum = 0;
$('.cost').click(function() {
if($(this).is(':checked')) {
sum = sum + parseInt($(this).val());
} else {
sum = sum - parseInt($(this).val());
}
$('#bedragen_selected').val(sum);
});