我正在尝试创建一个包含许多组的表单,其中包含许多单选按钮。当用户选择一个按钮时,我想计算每个选定单选按钮值的总和,并将该总和显示给用户。
我找到了一个用于计算的 jQuery 插件,这个插件使用按钮的名称属性来计算。例如,它将对名称为 sum
的所有按钮的值求和。
到目前为止,我已经尝试了两种设置方法:在第一种方法中,我为每个组创建一个隐藏字段来保存其中所选值的总和,这个隐藏字段获取值但问题是当用户选择按钮时,总值不会更新。我的代码如下所示:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script src="jquery.js" type="text/javascript">
</script>
<script src="calc.js" type="text/javascript">
</script>
<script src="calc_f.js" type="text/javascript">
</script>
<script type="text/javascript">
function DisplayPrice(price){
$('#spn_Price').val(price);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<input type="hidden" id="spn_Price" name="sum" value="">
<br>
<input id="rdo_1" type="radio" value="159" name="price" onclick="DisplayPrice(this.value);">
<br>
<input id="rdo_2" type="radio" value="259" name="price" onclick="DisplayPrice(this.value);">
<br>
<input type="text" name="totalSum" id="totalSum" value="" size="2" readonly="readonly">
</form>
</body>
</html>
在此代码中,名称为 totalSum
的输入标签是值将更新的地方,但它不会在更改按钮时更新。
正如我之前所说,我使用隐藏字段的原因是为了保存每个组的小计。它的名称是 sum
,它向插件表明它应该被添加到其他插件。
我不知道这样做是否正确,我曾尝试在用户单击按钮时将按钮的名称属性更改为sum
,但这也不起作用!
这是插件地址:http://www.pengoworks.com/workshop/jquery/calculation/calculation.plugin.htm
我该怎么做?
最佳答案
插件 schmugin。去掉你的 onclick 试试这个:
$("input[type=radio]").click(function() {
var total = 0;
$("input[type=radio]:checked").each(function() {
total += parseFloat($(this).val());
});
$("#totalSum").val(total);
});
关于javascript - 我如何使用 jQuery 计算单选按钮值的总和?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1324703/