SUM单选按钮值和复选框值在一个计算 - javascript和html [英] SUM radio button values and checkboxes values in one calculation - javascript and html
本文介绍了SUM单选按钮值和复选框值在一个计算 - javascript和html的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想计算单选按钮和复选框的值。
我有单选按钮按需工作，但不能得到复选框的脚本。
我想要复选框有一个子总计（这是工作正常），然后将该小计添加到单选按钮的计算。下面是我到目前为止。
任何建议将不胜感激。
感谢。
< form name =form1id =form1runat =server>
< legend>标题1< / legend>
< p>< input id =rdo_1type =radiovalue =3name =priceonClick =DisplayPrice（this.value）;>< label for = radio1> Radio 1< / label>< / p>
< p>< input id =rdo_2type =radiovalue =2name =priceonClick =DisplayPrice（this.value）;>< label for = radio2>无线电2< / label>< / p>
< p>< input id =rdo_2type =radiovalue =1name =priceonClick =DisplayPrice（this.value）;>< label for = radio3> Radio 3< / label>< / p>
< / form>
< hr>
< form name =form2id =form2runat =server>
< legend>标题2< / legend>
< p>< input id =rdo_1type =radiovalue =100name =price2onClick =DisplayPrice（this.value）;>< label for = rad1>无线电1< / label>< / p>
< p>< input id =rdo_2type =radiovalue =200name =price2onClick =DisplayPrice（this.value）;>< label for = rad2> Radio 2< / label>< / p>
< / form>
< hr>
< form name =form3id =form3runat =server>
< legend>标题3< / legend>
< p>< input id =rdo_1type =radiovalue =3name =price3onClick =DisplayPrice（this.value）;>< label for = ra1>收音机1< / label>< / p>
< p>< input id =rdo_2type =radiovalue =2name =price3onClick =DisplayPrice（this.value）;>< label for = ra2>收音机2< / label>< / p>
< p>< input id =rdo_2type =radiovalue =1name =price3onClick =DisplayPrice（this.value）;>< label for = ra3>收音机3< / label>< / p>
< / form>
< hr>
< form name =checkboxCalcid =checkboxCalc>
< p>< input onClick =clickCh（this）type =checkboxclass =checkboxname =PROD_FBBid =check01value =300/>< label for =check01>支票1< / label>< / p>
< p>< input onClick =clickCh（this）type =checkboxclass =checkboxname =PROD_RHFGid =check02value =200/>< label for =check02>支票2< / label>< / p>
< p>< input onClick =clickCh（this）type =checkboxclass =checkboxname =PROD_LHFGid =check03value =200/>< label for =check03>支票3< / label>< / p>
< / form>
< br />
< form name =form4id =form4runat =server>
< label for =check01>子总计：& nbsp;< / label>< input id =price4type =textname =price4readonly =readonly> ;
< / form>
< script language =JavaScripttype =text / javascript>
var total = document.getElementById（price4）
function clickCh（caller）{
if（caller.checked）{
add（caller）
} else {
subtract（caller）
}
}
function add（caller）{total.value = total.value * 1 + caller.value * 1}
function subtract（caller）{total.value = total.value * 1 - caller.value * 1}
< / script>
< hr>
< p>< label for =valueTotal>值$：< / label>
< input type =textname =valueTotalid =valueTotalvalue =size =2readonly =readonly>< / p&
< script type =text / javascript>
function DisplayPrice（price）{
var val1 = 0;
for（i = 0; i
val1 = document.form1.price [i] .value;
}
}
var val2 = 0;
for（i = 0; i
val2 = document.form2.price2 [i] .value;
}
}
var val3 = 0;
for（i = 0; i
val3 = document.form3.price3 [i] .value;
}
}
var val4 = 0;
for（i = 0; i
}
var sum = parseInt（val1）+ parseInt（val2）+ parseInt（val3）+ parseInt（val4）
document.getElementById（'valueTotal'）。value = sum;
}
< / script>
解决方案
如果
这里你可以做两件事情。
第一个只有一个小计的字段，因此可以直接赋值给val4，如下所示
val4 = document.form4.price4.value;
第二如果要运行for循环，
var val4 = 0;
var form4 = document.form4.getElementsByTagName（'input'）;
for（i = 0; i
if（isNaN（parseInt（form4 [i] .value））== false）{
val4 = parseInt（parseInt（val4）+ parseInt（form4 [i] .value）） ;
}
}
}
/ p>
在函数中
< script language =JavaScripttype = text / javascript>
var total = document.getElementById（price4）
function clickCh（caller）{
if（caller.checked）{
add（caller）
} else {
subtract（caller）
}
finalResult（）;
}
function add（caller）{total.value = total.value * 1 + caller.value * 1}
function subtract（caller）{total.value = total.value * 1 - caller.value * 1}
function finalResult（）{
var val1 = 0;
for（i = 0; i
val1 = document.form1.price [i] .value;
}
}
var val2 = 0;
for（i = 0; i
val2 = document.form2.price2 [i] .value;
}
}
var val3 = 0;
for（i = 0; i
val3 = document.form3.price3 [i] .value;
}
}
var val4 = 0;
var form4 = document.form4.getElementsByTagName（'input'）;
for（i = 0; i
if（isNaN（parseInt（form4 [i] .value））== false）{
val4 = parseInt（parseInt（val4）+ parseInt（form4 [i] .value）） ;
}
}
}
var sum = parseInt（val1）+ parseInt（val2）+ parseInt（val3）+ parseInt（val4）
document.getElementById（'valueTotal'）。value = sum;
}
< / script>
我希望它能为你工作
感谢
I am trying to calculate the values of radio buttons and checkboxes. I have the radio buttons working as required but cannot get the script right for the checkboxes. I want the check boxes to have a sub total (which is working fine) and then have that subtotal added to the calculation of the radio buttons. Below is what I have so far. Any suggestions would be appreciated. Thanks.
<form name="form1" id="form1" runat="server">
<legend>Header 1</legend>
<p><input id="rdo_1" type="radio" value="3" name="price" onClick="DisplayPrice(this.value);"><label for="radio1">Radio 1</label></p>
<p><input id="rdo_2" type="radio" value="2" name="price" onClick="DisplayPrice(this.value);"><label for="radio2">Radio 2</label></p>
<p><input id="rdo_2" type="radio" value="1" name="price" onClick="DisplayPrice(this.value);"><label for="radio3">Radio 3</label></p>
</form>
<hr>
<form name="form2" id="form2" runat="server">
<legend>Header 2</legend>
<p><input id="rdo_1" type="radio" value="100" name="price2" onClick="DisplayPrice(this.value);"><label for="rad1">Radio 1</label></p>
<p><input id="rdo_2" type="radio" value="200" name="price2" onClick="DisplayPrice(this.value);"><label for="rad2">Radio 2</label></p>
</form>
<hr>
<form name="form3" id="form3" runat="server">
<legend>Header 3</legend>
<p><input id="rdo_1" type="radio" value="3" name="price3" onClick="DisplayPrice(this.value);"><label for="ra1">Radio 1</label></p>
<p><input id="rdo_2" type="radio" value="2" name="price3" onClick="DisplayPrice(this.value);"><label for="ra2">Radio 2</label></p>
<p><input id="rdo_2" type="radio" value="1" name="price3" onClick="DisplayPrice(this.value);"><label for="ra3">Radio 3</label></p>
</form>
<hr>
<form name="checkboxCalc" id="checkboxCalc">
<p><input onClick="clickCh(this)" type="checkbox" class="checkbox" name="PROD_FBB" id="check01" value="300"/><label for="check01">Check 1</label></p>
<p><input onClick="clickCh(this)" type="checkbox" class="checkbox" name="PROD_RHFG" id="check02" value="200"/><label for="check02">Check 2</label></p>
<p><input onClick="clickCh(this)" type="checkbox" class="checkbox" name="PROD_LHFG" id="check03" value="200"/><label for="check03">Check 3</label></p>
</form>
<br />
<form name="form4" id="form4" runat="server">
<label for="check01">Sub Total: </label><input id="price4" type="text" name="price4" readonly="readonly" >
</form>
<script language="JavaScript" type="text/javascript">
var total = document.getElementById("price4")
function clickCh(caller){
if(caller.checked){
add(caller)
} else {
subtract(caller)
}
}
function add(caller){ total.value = total.value*1 + caller.value*1}
function subtract(caller){ total.value = total.value*1 - caller.value*1}
</script>
<hr>
<p><label for="valueTotal">Value$:</label>
<input type="text" name="valueTotal" id="valueTotal" value="" size="2" readonly="readonly"></p>
<script type="text/javascript">
function DisplayPrice(price){
var val1 = 0;
for( i = 0; i < document.form1.price.length; i++ ){
if( document.form1.price[i].checked == true ){
val1 = document.form1.price[i].value;
}
}
var val2 = 0;
for( i = 0; i < document.form2.price2.length; i++ ){
if( document.form2.price2[i].checked == true ){
val2 = document.form2.price2[i].value;
}
}
var val3 = 0;
for( i = 0; i < document.form3.price3.length; i++ ){
if( document.form3.price3[i].checked == true ){
val3 = document.form3.price3[i].value;
}
}
var val4 = 0;
for( i = 0; i < document.form4.price4.length; i++ ){
val4 = document.form4.price4[i].value;
}
var sum=parseInt(val1) + parseInt(val2) + parseInt(val3) + parseInt(val4);
document.getElementById('valueTotal').value=sum;
}
</script>
解决方案
In Javascript if there is single texbox of a specific name then length function will be return undefined.
Here you can do two things.
First there is only single field of subtotal so u can assign value direct to val4 like given below
val4 = document.form4.price4.value;
Second If you want to run for loop then
var val4 = 0;
var form4 = document.form4.getElementsByTagName('input');
for( i = 0; i < form4.length; i++ ){
if(form4[i].type == 'text' && form4[i].name == 'price4'){
if(isNaN(parseInt(form4[i].value)) == false){
val4 = parseInt(parseInt(val4) + parseInt(form4[i].value));
}
}
}
Edited
In function
<script language="JavaScript" type="text/javascript">
var total = document.getElementById("price4")
function clickCh(caller){
if(caller.checked){
add(caller)
} else {
subtract(caller)
}
finalResult();
}
function add(caller){ total.value = total.value*1 + caller.value*1}
function subtract(caller){ total.value = total.value*1 - caller.value*1}
function finalResult(){
var val1 = 0;
for( i = 0; i < document.form1.price.length; i++ ){
if( document.form1.price[i].checked == true ){
val1 = document.form1.price[i].value;
}
}
var val2 = 0;
for( i = 0; i < document.form2.price2.length; i++ ){
if( document.form2.price2[i].checked == true ){
val2 = document.form2.price2[i].value;
}
}
var val3 = 0;
for( i = 0; i < document.form3.price3.length; i++ ){
if( document.form3.price3[i].checked == true ){
val3 = document.form3.price3[i].value;
}
}
var val4 = 0;
var form4 = document.form4.getElementsByTagName('input');
for( i = 0; i < form4.length; i++ ){
if(form4[i].type == 'text' && form4[i].name == 'price4'){
if(isNaN(parseInt(form4[i].value)) == false){
val4 = parseInt(parseInt(val4) + parseInt(form4[i].value));
}
}
}
var sum=parseInt(val1) + parseInt(val2) + parseInt(val3) + parseInt(val4);
document.getElementById('valueTotal').value=sum;
}
</script>
i hope it will be work for you
thanks
这篇关于SUM单选按钮值和复选框值在一个计算 - javascript和html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
