页面环境:页面上有一个总金额输入框,下方有4个复选框表明产品系列,每个产品系列后跟一个输入框。
求助实现功能:当总金额框中输入金额后,点击下方产品复选框,上方总金额除以点击复选框产品系列的选定个数,如选定一个,就除以1 选定其中2个就除以2,并在选定产品系列后方输入框内显示平均数,且平均数取整汇总等于总金额。求大家如何实现。小弟,万分感谢,先将环境页面HTML代码奉上,望哪位大侠帮助!<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<form >
<p>总金额 <input type="text" name="sum" ></p>
<table width="75%" border="1">
<tr>
<td width="24%"><input type="checkbox" name="check" >产品系列A</td>
<td width="76%">平均金额 <input type="text" name="A" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" >产品系列B</td>
<td>平均金额 <input type="text" name="B" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" >产品系列C</td>
<td>平均金额 <input type="text" name="C" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" >产品系列D</td>
<td>平均金额 <input type="text" name="D" value="0"></td>
</tr>
</table>
</form>
</body>
</html>
求助实现功能:当总金额框中输入金额后,点击下方产品复选框,上方总金额除以点击复选框产品系列的选定个数,如选定一个,就除以1 选定其中2个就除以2,并在选定产品系列后方输入框内显示平均数,且平均数取整汇总等于总金额。求大家如何实现。小弟,万分感谢,先将环境页面HTML代码奉上,望哪位大侠帮助!<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<form >
<p>总金额 <input type="text" name="sum" ></p>
<table width="75%" border="1">
<tr>
<td width="24%"><input type="checkbox" name="check" >产品系列A</td>
<td width="76%">平均金额 <input type="text" name="A" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" >产品系列B</td>
<td>平均金额 <input type="text" name="B" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" >产品系列C</td>
<td>平均金额 <input type="text" name="C" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" >产品系列D</td>
<td>平均金额 <input type="text" name="D" value="0"></td>
</tr>
</table>
</form>
</body>
</html>
<script>
function doit(){
var f = document.forms[0];
var sum = f.sum.value;
if(isNaN(sum) || sum=="") return;
sum = parseInt(sum,10);
var a = [];
var A = "A".charCodeAt(0)
for(var i=0;i<f.check.length;i++){
if(f.check[i].checked) a[a.length] = f.elements[String.fromCharCode(A + i)];
}
var av = sum / a.length
for(var i=0;i<a.length;i++) a[i].value = parseInt(av,10);
}
</script>
<form>
<p>总金额<input type="text" name="sum"></p>
<table width="75%" border="1">
<tr>
<td width="24%"><input type="checkbox" name="check" onclick="doit()">产品系列A</td>
<td width="76%">平均金额 <input type="text" name="A" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" onclick="doit()">产品系列B</td>
<td>平均金额 <input type="text" name="B" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" onclick="doit()">产品系列C</td>
<td>平均金额 <input type="text" name="C" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" onclick="doit()">产品系列D</td>
<td>平均金额 <input type="text" name="D" value="0"></td>
</tr>
</table>
</form>
这个问题只要知道如何绑定事件,参考如下代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
</head>
<body>
<form>
<p>总金额 <input type="text" name="sum"></p>
<table width="75%" border="1">
<tr>
<td width="24%"><input type="checkbox" name="check">产品系列A </td>
<td width="76%">平均金额 <input type="text" name="A"value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check">产品系列B</td>
<td>平均金额 <input type="text" name="B" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check">产品系列C</td>
<td>平均金额 <input type="text" name="C" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check">产品系列D</td>
<td>平均金额 <input type="text" name="D" value="0"></td>
</tr>
</table>
</form>
<script>
(function() {
var checks = document.getElementsByName("check");
for(var i = 0; i < checks.length; i++) {
checks[i].onclick = function() {
alert(this.parentNode.parentNode.getElementsByTagName("input")[1].value);
//this checkbox
//this.parentNode td
//this.parentNode.parentNode tr
//this.parentNode.parentNode.getElementsByTagName("input")[1] <input type="text" name="xxx">
};
}
})();
</script>
</body>
</html>
<script>
function doit(){
var f = document.forms[0];
var sum = f.sum.value;
if(isNaN(sum) || sum=="") return;
sum = parseInt(sum,10);
var a = [];
var A = "A".charCodeAt(0)
for(var i=0;i<f.check.length;i++){
if(f.check[i].checked) a[a.length] = f.elements[String.fromCharCode(A + i)];
else f.elements[String.fromCharCode(A + i)].value = "";
}
var av = sum / a.length
for(var i=0;i<a.length;i++) a[i].value = parseInt(av,10);
}
</script>
<form>
<p>总金额<input type="text" name="sum"></p>
<table width="75%" border="1">
<tr>
<td width="24%"><input type="checkbox" name="check" onclick="doit()">产品系列A</td>
<td width="76%">平均金额 <input type="text" name="A" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" onclick="doit()">产品系列B</td>
<td>平均金额 <input type="text" name="B" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" onclick="doit()">产品系列C</td>
<td>平均金额 <input type="text" name="C" value="0"></td>
</tr>
<tr>
<td><input type="checkbox" name="check" onclick="doit()">产品系列D</td>
<td>平均金额 <input type="text" name="D" value="0"></td>
</tr>
</table>
</form>
var f = document.forms[0];
var sum = f.sum.value;
if(isNaN(sum) || sum=="") return;
sum = parseInt(sum,10);
var a = [];
var b = [];
var A = "A".charCodeAt(0)
for(var i=0;i<f.check.length;i++){
if(f.check[i].checked) a[a.length] = f.elements[String.fromCharCode(A + i)];
}
for(var i=0;i<f.check.length;i++){
if(!f.check[i].checked) b[b.length] = f.elements[String.fromCharCode(A + i)];
}
var av = sum / a.length
for(var i=0;i<a.length;i++) a[i].value = parseInt(av,10);
for(var i=0;i<b.length;i++) b[i].value = 0;
}
</script>