用JavaScript编写多个文本框+复选框求和，只有复选框被选择时候才生效，具体可看图
多个文本框+复选框求和，只有复选框被选择时候才生效，。使用doucument.form.name取值，name为一组控件名称。最后结果如图二样式。只能JavaScript...
多个文本框+复选框求和，只有复选框被选择时候才生效，。使用doucument.form.name取值，name为一组控件名称。最后结果如图二样式。只能JavaScript
展开
展开全部
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RunJS 演示代码</title>
<style>
table{
margin:0 auto;
width:400px;
border-collapse:collapse;
}
th{
background-color:gray;
}
th,td{
text-align:center;
border:1px solid gray;
}
</style>
<script>
var qh=function(){
var ts=document.fm.t;
var sum=0;
for(var i=0;i<ts.length-1;i++){
var ti=ts[i];
var ci=ti.parentElement.nextElementSibling.children[0];
if(ci.checked){
sum+=parseFloat(ti.value);
}
}
ts[ts.length-1].value=sum;
}
</script>
</head>
<body>
<form name="fm">
<table>
<tr><th>金额</th><th>是否求和</th></tr>
<tr><td><input type="text" name="t" /></td><td><input type="checkbox" /></td></tr>
<tr><td><input type="text" name="t"/></td><td><input type="checkbox" /></td></tr>
<tr><td><input type="text" name="t"/></td><td><input type="checkbox" /></td></tr>
<tr><td><input type="text" name="t"/></td><td><input type="checkbox" /></td></tr>
<tr><td><input type="text" name="t"/></td><td><input type="checkbox" /></td></tr>
<tr><td><input type="text" name="t"/></td><td><input type="checkbox" /></td></tr>
<tr><td><input type="text" name="t"/></td><td><input type="checkbox" /></td></tr>
<tr><td>合计<input type="text" name="t" />元</td><td><input type="button" value="求和" onclick="qh()" /></td></tr>
</table>
</form>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
要先获取复选框的集合，然后再遍历，选中的话就进入计算累加。如：
var arr=document.form.name["checkbox"];//这种获取方式很少用了
var amount=0;//总价格
for(var i=0;i<arr.length;i++){
var ele=arr[i];
if(ele.checked){//判断是否被选中,被选中就获取前面的输入框，并相加
var inpEle=ele.parentNode.previousSbiling.firstChild;//获取复选框的父节点的兄弟节点的子节点
var val=inpEle.value;//输入框的内容
if(val!=''&& !isNaN(val)){//判断内容是否为数字
amount=amount+parseFloat(val);
}
}
}
我只是提供一个思路，代码不能直接在浏览器运行。如果用jQuery的话，获取复选框或输入框就方便点。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
