高分求JS高手,帮忙解决一个计算的问题。急~~!!

闭目鱼 2010-08-26 03:13:07
若问题解决,将再开一帖给分
我的问题如下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档-SH!</title>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="669" border="1">
<tr>
<td width="80"></td>
<td width="168">十</td>
<td width="195">元</td>
<td width="198">角</td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="十1" id="十1" /></td>
<td><input type="text" name="元1" id="元1" /></td>
<td><input type="text" name="角1" id="角1" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="十2" id="十2" /></td>
<td><input type="text" name="元2" id="元2" /></td>
<td><input type="text" name="角2" id="角2" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="十3" id="十3" /></td>
<td><input type="text" name="元3" id="元3" /></td>
<td><input type="text" name="角3" id="角3" /></td>
</tr>
<tr>
<td>合计</td>
<td><input type="text" name="合计十" id="合计十" /></td>
<td><input type="text" name="合计元" id="合计元" /></td>
<td><input type="text" name="合计角" id="合计角" /></td>
</tr>
<tr>
<td id="总计" colspan="4">总计<input type="text" name="总计" id="总计" /></td>
</tr>
</table>
</form>
</body>
</html>


有这样一个页面。用来计算总金额的。
在“角”那一列下面三行内,任意一行输入小于9的数字,都要把这个结果计算出来填入“合计角”那一格
如果超过9则往“元”那一格进一,与平时的运算是一个规律的。
“元”那一列效果类似
“十”这一列的“合计十”的结果可以大于10

例如

十 元 角
1 2 5
2 5 3
4 7 6
合计 8 5 4
总计 85.4
------------------------------------

十 元 角
0 0 5
0 0 3
0 0 6
合计 0 1 4
总计 1.4

------------------------------------

十 元 角
9 9 9
9 9 9
9 9 9
合计 29 9 7
总计 299.7
...全文
113 点赞 收藏 8
写回复
8 条回复
切换为时间正序
当前发帖距今超过3年,不再开放新的回复
发表回复
lein_design 2010-08-26
将natineprince的代码修改了下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>example!</title>
<script>
function $(name){return document.getElementById(name);}
function a(obj){
var re=/\d/;
if(re.test(obj.value))
obj.value%=10;
sum();
}
function b(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
sum();
}
function c(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
sum();
}
function sum(){
$("aa").value=parseInt($("a1").value)+parseInt($("a2").value)+parseInt($("a3").value);
$("bb").value=parseInt($("b1").value)+parseInt($("b2").value)+parseInt($("b3").value);
$("cc").value=parseInt($("c1").value)+parseInt($("c2").value)+parseInt($("c3").value);
$("bb").value=parseInt($("bb").value)+parseInt($("cc").value)/10;
if($("bb").value>9){
$("aa").value+=$("bb").value/10;
$("bb").value%=10;
}
$("aa").value=parseInt($("aa").value)+parseInt($("bb").value)/10;
$("cc").value%=10;
$("aa").value=Math.floor($("aa").value);
$("bb").value=Math.floor($("bb").value);
$("cc").value=Math.floor($("cc").value);
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)+parseInt($("cc").value)/10;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="669" border="1">
<tr>
<td width="80"></td>
<td width="168">十</td>
<td width="195">元</td>
<td width="198">角</td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a1" id="a1" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b1" id="b1" onchange="b(this)" value="0"/></td>
<td><input type="text" name="c1" id="c1" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a2" id="a2" onchange="a(this)" value="0" /></td>
<td><input type="text" name="b2" id="b2" onchange="b(this)" value="0" /></td>
<td><input type="text" name="c2" id="c2" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a3" id="a3" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b3" id="b3" onchange="b(this)" value="0" /></td>
<td><input type="text" name="c3" id="c3" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td>合计</td>
<td><input type="text" name="aa" id="aa" value="0" readonly/></td>
<td><input type="text" name="bb" id="bb" value="0" readonly/></td>
<td><input type="text" name="cc" id="cc" value="0" readonly/></td>
</tr>
<tr>
<td colspan="4">总计<input type="text" name="d" id="d" value="0" readonly/></td>
</tr>
</table>
</form>
</body>
</html>
回复
shenzhenNBA 2010-08-26
修改了1L的文件,如果元这列可以大于10,那前面的 十 这列没必要用了,有点多余, 反而理解容易出错,要用那元这列不能大于10,大于则向前进1

function b(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
var cx=parseInt($("c1").value)+parseInt($("c2").value)+parseInt($("c3").value);
$("bb").value=parseInt($("b1").value)+parseInt($("b2").value)+parseInt($("b3").value)+ parseInt(cx/10);

$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)+parseInt($("cc").value)%10/10;
}

function c(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
var cx=parseInt($("c1").value)+parseInt($("c2").value)+parseInt($("c3").value);
$("cc").value=cx%10;
$("bb").value=parseInt($("b1").value)+parseInt($("b2").value)+parseInt($("b3").value)+ parseInt(cx/10);

$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)+parseInt($("cc").value)%10/10;
}


完整如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>无标题文档-SH!</title>
<script>
function $(name){return document.getElementById(name);}
function a(obj){
var re=/\d/;
if(re.test(obj.value))
obj.value%=10;

$("aa").value=parseInt($("a1").value)+parseInt($("a2").value)+parseInt($("a3").value);
$("bb").value=parseInt($("bb").value)+parseInt($("cc").value)%10;
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)%10+parseInt($("cc").value)%10/10;
}

function b(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
var cx=parseInt($("c1").value)+parseInt($("c2").value)+parseInt($("c3").value);
$("bb").value=parseInt($("b1").value)+parseInt($("b2").value)+parseInt($("b3").value)+ parseInt(cx/10);
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)+parseInt($("cc").value)%10/10;
}

function c(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
var cx=parseInt($("c1").value)+parseInt($("c2").value)+parseInt($("c3").value);
$("cc").value=cx%10;
$("bb").value=parseInt($("b1").value)+parseInt($("b2").value)+parseInt($("b3").value)+ parseInt(cx/10);
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)+parseInt($("cc").value)%10/10;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="669" border="1">
<tr>
<td width="80"></td>
<td width="168">十</td>
<td width="195">元</td>
<td width="198">角</td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a1" id="a1" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b1" id="b1" onchange="b(this)" value="0"/></td>
<td><input type="text" name="c1" id="c1" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a2" id="a2" onchange="a(this)" value="0" /></td>
<td><input type="text" name="b2" id="b2" onchange="b(this)" value="0" /></td>
<td><input type="text" name="c2" id="c2" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a3" id="a3" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b3" id="b3" onchange="b(this)" value="0" /></td>
<td><input type="text" name="c3" id="c3" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td>合计</td>
<td><input type="text" name="aa" id="aa" value="0" readonly/></td>
<td><input type="text" name="bb" id="bb" value="0" readonly/></td>
<td><input type="text" name="cc" id="cc" value="0" readonly/></td>
</tr>
<tr>
<td colspan="4">总计<input type="text" name="d" id="d" value="0" readonly/></td>
</tr>
</table>
</form>
</body>
</html>

回复
闭目鱼 2010-08-26
多谢了!
回复
natineprince 2010-08-26
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>无标题文档-SH!</title>
<script>
function $(name){return document.getElementById(name);}
function a(obj){
var re=/\d\d+/;
if(re.test(obj.value))
obj.value%=10;
sum();
}
function sum(){
$("aa").value=parseInt($("a1").value)+parseInt($("a2").value)+parseInt($("a3").value);
$("bb").value=parseInt($("b1").value)+parseInt($("b2").value)+parseInt($("b3").value);
$("cc").value=parseInt($("c1").value)+parseInt($("c2").value)+parseInt($("c3").value);
$("bb").value=parseInt($("bb").value)+parseInt($("cc").value)/10;
$("cc").value%=10;
$("aa").value=parseInt($("aa").value)+parseInt($("bb").value)/10;
$("bb").value%=10;
$("aa").value=Math.floor($("aa").value);
$("bb").value=Math.floor($("bb").value);
$("cc").value=Math.floor($("cc").value);
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)+parseInt($("cc").value)/10;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="669" border="1">
<tr>
<td width="80"></td>
<td width="168">十</td>
<td width="195">元</td>
<td width="198">角</td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a1" id="a1" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b1" id="b1" onchange="a(this)" value="0"/></td>
<td><input type="text" name="c1" id="c1" onchange="a(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a2" id="a2" onchange="a(this)" value="0" /></td>
<td><input type="text" name="b2" id="b2" onchange="a(this)" value="0" /></td>
<td><input type="text" name="c2" id="c2" onchange="a(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a3" id="a3" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b3" id="b3" onchange="a(this)" value="0" /></td>
<td><input type="text" name="c3" id="c3" onchange="a(this)" value="0" /></td>
</tr>
<tr>
<td>合计</td>
<td><input type="text" name="aa" id="aa" value="0" readonly/></td>
<td><input type="text" name="bb" id="bb" value="0" readonly/></td>
<td><input type="text" name="cc" id="cc" value="0" readonly/></td>
</tr>
<tr>
<td colspan="4">总计<input type="text" name="d" id="d" value="0" readonly/></td>
</tr>
</table>
</form>
</body>
</html>
我果然不是做TEST的料啊...
回复
闭目鱼 2010-08-26
[Quote=引用 3 楼 natineprince 的回复:]
读错你的意思了...改了..

HTML code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>无标题文档-SH!</title>
<script>
function $(name){return document.getElementById(na……
[/Quote]

这个答案确实可以实现,不过还有点小bug,“合计元”会出现10,
我也写了一个,不过只能实现一列的累加,当填写完“角”再去填写“元”就不对了

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档-SH!</title>
<script>
function $id(id){
return document.getElementById(id);
}
var types=["角","元","十"]
function sum(dataName,type){
var summ = 0;
for(i=1;i<=3;i++){
var alldata=$id(dataName+i+"");
if(alldata.value==""){
summ=parseInt(summ)+0;
}else{
summ=parseInt(summ)+parseInt(alldata.value);
}
}
checksum(dataName,summ,type);
}
function checksum(dataName,summ,type){
if(summ>=10 && summ<100){
var newSum =summ+"";
var num1 = newSum.substr(0,1);
var num2 = newSum.substr(1,2);
$id("合计"+dataName).value=num2;
type=returnType(type);
$id("合计"+type).value=num1;
}else{
$id("合计"+dataName).value=summ;
}
}
function returnType(type){
for(i=0;i<types.length-1;i++){
if(type==types[i]){
return types[i+1];
}
}
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="669" border="1">
<tr>
<td width="80"></td>
<td width="168">十</td>
<td width="195">元</td>
<td width="198">角</td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="十1" id="十1" /></td>
<td><input type="text" name="元1" id="元1" onchange="sum('元','元')"/></td>
<td><input type="text" name="角1" id="角1" onchange="sum('角','角')"/></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="十2" id="十2" /></td>
<td><input type="text" name="元2" id="元2" onchange="sum('元','元')"/></td>
<td><input type="text" name="角2" id="角2" onchange="sum('角','角')"/></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="十3" id="十3" /></td>
<td><input type="text" name="元3" id="元3" onchange="sum('元','元')"/></td>
<td><input type="text" name="角3" id="角3" onchange="sum('角','角')"/></td>
</tr>
<tr>
<td>合计</td>
<td><input type="text" name="合计十" id="合计十" /></td>
<td><input type="text" name="合计元" id="合计元" /></td>
<td><input type="text" name="合计角" id="合计角" /></td>
</tr>
<tr>
<td id="总计" colspan="4">总计<input type="text" name="总计" id="总计" /></td>
</tr>
</table>
</form>
</body>
</html>

回复
natineprince 2010-08-26
读错你的意思了...改了..
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>无标题文档-SH!</title>
<script>
function $(name){return document.getElementById(name);}
function a(obj){
var re=/\d/;
if(re.test(obj.value))
obj.value%=10;
sum();
}
function b(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
sum();
}
function c(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
sum();
}
function sum(){
$("aa").value=parseInt($("a1").value)+parseInt($("a2").value)+parseInt($("a3").value);
$("bb").value=parseInt($("b1").value)+parseInt($("b2").value)+parseInt($("b3").value);
$("cc").value=parseInt($("c1").value)+parseInt($("c2").value)+parseInt($("c3").value);
$("aa").value=parseInt($("aa").value)+parseInt($("bb").value)/10;
$("bb").value%=10;
$("bb").value=parseInt($("bb").value)+parseInt($("cc").value)/10;
$("cc").value%=10;
$("aa").value=Math.floor($("aa").value);
$("bb").value=Math.floor($("bb").value);
$("cc").value=Math.floor($("cc").value);
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)+parseInt($("cc").value)/10;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="669" border="1">
<tr>
<td width="80"></td>
<td width="168">十</td>
<td width="195">元</td>
<td width="198">角</td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a1" id="a1" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b1" id="b1" onchange="b(this)" value="0"/></td>
<td><input type="text" name="c1" id="c1" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a2" id="a2" onchange="a(this)" value="0" /></td>
<td><input type="text" name="b2" id="b2" onchange="b(this)" value="0" /></td>
<td><input type="text" name="c2" id="c2" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a3" id="a3" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b3" id="b3" onchange="b(this)" value="0" /></td>
<td><input type="text" name="c3" id="c3" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td>合计</td>
<td><input type="text" name="aa" id="aa" value="0" readonly/></td>
<td><input type="text" name="bb" id="bb" value="0" readonly/></td>
<td><input type="text" name="cc" id="cc" value="0" readonly/></td>
</tr>
<tr>
<td colspan="4">总计<input type="text" name="d" id="d" value="0" readonly/></td>
</tr>
</table>
</form>
</body>
</html>
回复
闭目鱼 2010-08-26
[Quote=引用 1 楼 natineprince 的回复:]
HTML code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>无标题文档-SH!</title>
<script>
function $(name){return document.getElementById(name);}
function a(……
[/Quote]

这位朋友,谢谢你的回答。但是你这答案不行
假如我在“角”那列的三个格子里都输入9.计算结果应该是2.7。
且“元”那列的“总计元”里要变成2.“总计角”变成7
回复
natineprince 2010-08-26
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>无标题文档-SH!</title>
<script>
function $(name){return document.getElementById(name);}
function a(obj){
var re=/\d/;
if(re.test(obj.value))
obj.value%=10;
$("aa").value=parseInt($("a1").value)+parseInt($("a2").value)+parseInt($("a3").value);
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)%10+parseInt($("cc").value)%10/10;
}
function b(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
$("bb").value=(parseInt($("b1").value)+parseInt($("b2").value)+parseInt($("b3").value))%10;
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)%10+parseInt($("cc").value)%10/10;
}
function c(obj){
var re=/\d/;
if(!re.test(obj.value))
obj.value%=10;
$("cc").value=(parseInt($("c1").value)+parseInt($("c2").value)+parseInt($("c3").value))%10;
$("d").value=parseInt($("aa").value)*10+parseInt($("bb").value)%10+parseInt($("cc").value)%10/10;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="669" border="1">
<tr>
<td width="80"></td>
<td width="168">十</td>
<td width="195">元</td>
<td width="198">角</td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a1" id="a1" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b1" id="b1" onchange="b(this)" value="0"/></td>
<td><input type="text" name="c1" id="c1" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a2" id="a2" onchange="a(this)" value="0" /></td>
<td><input type="text" name="b2" id="b2" onchange="b(this)" value="0" /></td>
<td><input type="text" name="c2" id="c2" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td> </td>
<td><input type="text" name="a3" id="a3" onchange="a(this)" value="0"/></td>
<td><input type="text" name="b3" id="b3" onchange="b(this)" value="0" /></td>
<td><input type="text" name="c3" id="c3" onchange="c(this)" value="0" /></td>
</tr>
<tr>
<td>合计</td>
<td><input type="text" name="aa" id="aa" value="0" readonly/></td>
<td><input type="text" name="bb" id="bb" value="0" readonly/></td>
<td><input type="text" name="cc" id="cc" value="0" readonly/></td>
</tr>
<tr>
<td colspan="4">总计<input type="text" name="d" id="d" value="0" readonly/></td>
</tr>
</table>
</form>
</body>
</html>
回复
相关推荐
发帖
JavaScript
创建于2007-09-28

8.5w+

社区成员

Web 开发 JavaScript
申请成为版主
帖子事件
创建了帖子
2010-08-26 03:13
社区公告
暂无公告