初学JavaScript,checkbox勾选计算和值并显示
<html><head><title>checkbox项的自动计算</title><scripttype="text/javascript"><!--functionca...
<html>
<head>
<title>checkbox项的自动计算</title>
<script type="text/javascript">
<!--
function calc(){
//****************************************************
total = c1.checked*c1.value +
c2.checked*c2.value +
c3.checked*c3.value +
c4.checked*c4.value +
c5.checked*c5.value +
c6.checked*c6.value +
c7.checked*c7.value;
//****************************************************
}
-->
</script>
</head>
<body bgcolor="#FFffFF">
<center>
<h2>合计金额计算</h2>
</center>
<br>
<form name="calcFORM">
<input type="checkbox" value="200" onClick="calc()">商品1【200元】<br>
<input type="checkbox" value="130" onClick="calc()">商品2【130元】<br>
<input type="checkbox" value="530" onClick="calc()">商品3【530元】<br>
<input type="checkbox" value="30" onClick="calc()">商品4【30元】<br>
<br>
<input type="checkbox" value="1200" onClick="calc()">商品5【1200元】<br>
<input type="checkbox" value="2300" onClick="calc()">商品6【2300元】<br>
<input type="checkbox" value="3100" onClick="calc()">商品7【3100元】<br>
<br>
合计金额:<input type="text" name="total">
</form>
</body>
</html>
自动计算出选中的checkbox项的合计金额值并显示出来。
为什么总是不显示呢。。。求大神指点
if(document.calcFORM.elements[i].checked)
Yuan += eval(document.calcFORM.elements[i].value);
document.calcFORM.total.value = Yuan + "元";
这是老师给的另外一个函数方法试了也不显示 展开
<head>
<title>checkbox项的自动计算</title>
<script type="text/javascript">
<!--
function calc(){
//****************************************************
total = c1.checked*c1.value +
c2.checked*c2.value +
c3.checked*c3.value +
c4.checked*c4.value +
c5.checked*c5.value +
c6.checked*c6.value +
c7.checked*c7.value;
//****************************************************
}
-->
</script>
</head>
<body bgcolor="#FFffFF">
<center>
<h2>合计金额计算</h2>
</center>
<br>
<form name="calcFORM">
<input type="checkbox" value="200" onClick="calc()">商品1【200元】<br>
<input type="checkbox" value="130" onClick="calc()">商品2【130元】<br>
<input type="checkbox" value="530" onClick="calc()">商品3【530元】<br>
<input type="checkbox" value="30" onClick="calc()">商品4【30元】<br>
<br>
<input type="checkbox" value="1200" onClick="calc()">商品5【1200元】<br>
<input type="checkbox" value="2300" onClick="calc()">商品6【2300元】<br>
<input type="checkbox" value="3100" onClick="calc()">商品7【3100元】<br>
<br>
合计金额:<input type="text" name="total">
</form>
</body>
</html>
自动计算出选中的checkbox项的合计金额值并显示出来。
为什么总是不显示呢。。。求大神指点
if(document.calcFORM.elements[i].checked)
Yuan += eval(document.calcFORM.elements[i].value);
document.calcFORM.total.value = Yuan + "元";
这是老师给的另外一个函数方法试了也不显示 展开
1个回答
展开全部
<html>
<head>
<title>checkbox项的自动计算</title>
<script type="text/javascript">
var val = 0;
function calc(obj){
val += parseInt(obj.value);
document.getElementById('total').value = val;
}
</script>
</head>
<body bgcolor="#FFffFF">
<center>
<h2>合计金额计算</h2>
</center>
<br>
<form name="calcFORM">
<input type="checkbox" value="200" onClick="calc(this)">商品1【200元】<br>
<input type="checkbox" value="130" onClick="calc(this)">商品2【130元】<br>
<input type="checkbox" value="530" onClick="calc(this)">商品3【530元】<br>
<input type="checkbox" value="30" onClick="calc(this)">商品4【30元】<br>
<br>
<input type="checkbox" value="1200" onClick="calc(this)">商品5【1200元】<br>
<input type="checkbox" value="2300" onClick="calc(this)">商品6【2300元】<br>
<input type="checkbox" value="3100" onClick="calc(this)">商品7【3100元】<br>
<br>
合计金额:<input id="total" type="text" name="total">
</form>
</body>
</html>
<head>
<title>checkbox项的自动计算</title>
<script type="text/javascript">
var val = 0;
function calc(obj){
val += parseInt(obj.value);
document.getElementById('total').value = val;
}
</script>
</head>
<body bgcolor="#FFffFF">
<center>
<h2>合计金额计算</h2>
</center>
<br>
<form name="calcFORM">
<input type="checkbox" value="200" onClick="calc(this)">商品1【200元】<br>
<input type="checkbox" value="130" onClick="calc(this)">商品2【130元】<br>
<input type="checkbox" value="530" onClick="calc(this)">商品3【530元】<br>
<input type="checkbox" value="30" onClick="calc(this)">商品4【30元】<br>
<br>
<input type="checkbox" value="1200" onClick="calc(this)">商品5【1200元】<br>
<input type="checkbox" value="2300" onClick="calc(this)">商品6【2300元】<br>
<input type="checkbox" value="3100" onClick="calc(this)">商品7【3100元】<br>
<br>
合计金额:<input id="total" type="text" name="total">
</form>
</body>
</html>
追问
谢谢
能不能再说一下为什么要加this和obj呢。。
好像去掉不行 但感觉意思差不不多啊
追答
this表示当前对象,说的白一点就是你点击的checkbox对象,意思是将当前对象作为参数传到function calc(obj) 方法中去。
obj是参数,接收传过来了的this对象。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询