现在在制作一个商品入库的信息页面。需要实时的计算输入的结果,以及产生的费用等。
不过当一次录入的商品太多的时候,效率很低。大家帮忙看看有没有什么好的办法进行修改.页面信息基本是这样的
-------------------------------
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
总价格
每一行都是一个商品。
输入单价的时候,需要计算本次的价格。
如果是修改页面的话。就需要循环计算所有的价格,最后汇总成为总价格。
由于使用的是循环,所以在商品数量很多的时候,页面就很卡。不知道有没有办法修改效率。
不过当一次录入的商品太多的时候,效率很低。大家帮忙看看有没有什么好的办法进行修改.页面信息基本是这样的
-------------------------------
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
商品名称,单价,数量,税率, = 小计价格
总价格
每一行都是一个商品。
输入单价的时候,需要计算本次的价格。
如果是修改页面的话。就需要循环计算所有的价格,最后汇总成为总价格。
由于使用的是循环,所以在商品数量很多的时候,页面就很卡。不知道有没有办法修改效率。
<script>
window.onload=function(){
var tbl=document.getElementById("tbl1");
var oldValue=0;
for(var i=0;i<tbl.rows.length;i++){
if(tbl.rows[i].cells.length==3){
(function(){
var index=i;
tbl.rows[index].cells[1].childNodes[0].onfocus=
function(){
oldValue=parseInt(tbl.rows[index].cells[2].childNodes[0].value)|0;
};
tbl.rows[index].cells[1].childNodes[0].onchange=
function(){
tbl.rows[index].cells[2].childNodes[0].value=
parseInt(tbl.rows[index].cells[0].innerHTML)*
parseInt(tbl.rows[index].cells[1].childNodes[0].value);
document.getElementById("sumP").value=
(parseInt(document.getElementById("sumP").value)|0)+
parseInt(tbl.rows[index].cells[2].childNodes[0].value)-oldValue;
};
})();
}
}
}
</script>
<table border=1 id=tbl1>
<tr><td>100</td><td><input type=text></td><td><input type=text></td></tr>
<tr><td>200</td><td><input type=text></td><td><input type=text></td></tr>
<tr><td>300</td><td><input type=text></td><td><input type=text></td></tr>
<tr><td colspan=3 align=right>Sum:<input type=text id=sumP></td></tr>
</table>
我写了两个方法
一个是calculateRowSum --计算行总额
一个是calculateSum -- 计算总额
calculateSum方法只计算 计算好的行总额 (有点绕口)
因为你当前修改的只能是一行数据,所以在事件中只要计算一次行总额和n次加运算就可以了
目前我项目中还没有碰到lz效率低下的情况