开销售单时怎么计算 数量*单价=小计 每一行都是这样算法,想了很久还是没有解决。 onBlur="javascript:小计.value=数量.value*单价.value;" 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 问题是多行,右边的“+”是可以加多一行的。那数量就变成多个了怎么识别小计[i].value=数量[i].value*单价[i].value var oTable = 表格对象for(var i=1,i<oTable.rows.count;i++){ var oNub = oTable.rows[i].cells[3].firstChild;//数量(表格第4列单元格中的第一个对象) var oUnit = oTable.rows[i].cells[4].firstChild;//单价 var oTatal = oTable.rows[i].cells[5].firstChild;//总价 oTatal.value = parseFloat(oNub.value)*parseFloat(oNub.value);} 写错了oTable.rows.count改成oTable.rows.length 项目中正好有,改了下,希望对你有用<html><head><meta http-equiv="Content-Language" content="zh-cn"><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>test</title><script>function getTotal(obj,index){ //这里可以对obj.value做校验 //index为1的时候,符点数 //index为2的时候,整数 var td1,td2,td3; if(index==1){ td1 = obj.parentNode; td2 = td1.nextSibling; }else{ td2 = obj.parentNode; td1 = td2.previousSibling; } td3 = td2.nextSibling; if(td1.firstChild.value!=""&&td2.firstChild.value!="") { td3.firstChild.value=parseFloat(td1.firstChild.value)*parseInt(td2.firstChild.value); }}</script></head><body><table border="1" width="48%"> <tr> <td align="center">单价</td> <td align="center">数量</td> <td align="center">小计</td> </tr> <tr> <td><input type="text" value="" onblur="getTotal(this,1)"> </td> <td><input type="text" value="" onblur="getTotal(this,2)"> </td> <td><input type="text" value=""> </td> </tr> <tr> <td><input type="text" value="" onblur="getTotal(this,1)"> </td> <td><input type="text" value="" onblur="getTotal(this,2)"> </td> <td><input type="text" value=""> </td> </tr> <tr> <td><input type="text" value="" onblur="getTotal(this,1)"> </td> <td><input type="text" value="" onblur="getTotal(this,2)"> </td> <td><input type="text" value=""> </td> </tr></table></body></html> <script>function calculate(index){ if(!index){alert("参数错误!");return;} var p=document.getElementById('p'+index); var q=document.getElementById('q'+index); //这里做数字验证,省略 var subtotal=p*q; document.getElementById('s'+index).value=subtotal;//小计 //合计: var total=0; for (....){ total+=document.getElementById('s'+index).value } document.getElementById('合计的文本框id').value=total}</script><table border="1" width="48%"> <tr> <td align="center">单价</td> <td align="center">数量</td> <td align="center">小计</td> </tr> <tr ln=1> <td><input type="text" id=p0 name=p value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td> <td><input type="text" id=q0 name=q value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td> <td><input type="text" id=s0 name=s value=""> </td> </tr> <tr ln=2> <td><input type="text" id=p1 name=p value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td> <td><input type="text" id=q1 name=q value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td> <td><input type="text" id=s1 name=s value=""> </td> </tr> <tr ln=3> <td><input type="text" id=p2 name=p value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td> <td><input type="text" id=q2 name=q value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td> <td><input type="text" id=s2 name=s value=""> </td> </tr></table>如果动态插入行,注意加TR的 ln属性,且默认数量和价格的文本框value=0删除行时,要重新排列各个控件的idy以及TR的 ln属性值,不然就乱套了 9F的方法也可以,但如果有删除功能的时候,行标ln要用一个全局变量来控制,千万不要认为第几行,ln就是几类似这种行操作的,建议尽量不要加入一些计数标志位,代码量大的话容易混淆 思路:1,获取父节点的对象数组(关键在于 var os = obj.parentNode.getElementsByTagName("td"))2,根据顺序来计算小计的值 (os[i].value*os[j].value) 好久不写这么抓狂的js了,今儿给你整一个爽的。比较简洁,也解决浮点数相乘的长尾数问题(17.3X77=1332.1000000000001)而且,输入过程中即可看见结果变化,即输即算,反应很快的,可以和7楼对比下。用了ie里的expression魔法。<html><head><meta http-equiv="Content-Language" content="zh-cn"><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>test</title><style type="text/css">input.X { width:30px; text-align:center; border:none; x:expression(this.value==parentNode.parentNode.rowIndex+'' || (this.value=parentNode.parentNode.rowIndex,readOnly=true));}input.A { text-align:center; x:expression((this.value==this.value2) || MUL(this));}input.Z { text-align:center; }</style><script>function MUL(obj){ var row=obj.parentNode.parentNode; var a=parseFloat(row.cells(1).firstChild.value); var b=parseFloat(row.cells(2).firstChild.value); var c=((isNaN(a)||isNaN(b))?'':((a*b)+'')); if(c!='' && c.search(/\..*?0{4,}1$/)>0)c=c.replace(/0{4,}1$/,''); if(c!='' && c.search(/\..*?9{4,}[89]$/)>0){ c=c.replace(/9{4,}[89]$/,''); var tail=c.charAt(c.length-1); if(tail=='.')c=c.substring(0,c.length-1) c = c.indexOf('.')>=0 ? c.substring(0,c.length-1)+(eval(tail)+1) : (eval(c)+1)+''; } if(typeof(obj.value2)!='string'||obj.value2!=obj.value){ obj.value2=obj.value; row.cells(3).firstChild.value=c; } return c;}function del(row){ if(TBODY1.rows.length>2){row.removeNode(true);}}function add(){ var tr=TBODY1.insertRow(); tr.insertCell().innerHTML='<input class="X">'; tr.insertCell().innerHTML='<input class="A">'; tr.insertCell().innerHTML='<input class="A">'; tr.insertCell().innerHTML='<input class="Z">'; tr.insertCell().innerHTML='<input type="button" value="删除" onclick="del(parentNode.parentNode)">';}</script></head><body onload="for(var i=0;i<5;i++)add();"><table border="1" width="48%"> <col align="center"><col align="center"><col align="center"><col align="center"><col align="center"> <tbody id="TBODY1"> <tr> <td> </td> <td>单价</td> <td>数量</td> <td>小计</td> <td><input type="button" value="添加" onclick="add()"></td> </tr> <tr> <td><input class="X"></td> <td><input class="A"></td> <td><input class="A"></td> <td><input class="Z"></td> <td><input type="button" value="删除" onclick="del(parentNode.parentNode)"></td> </tr> </tbody></table></body></html> javascript OOP==>Array---Object---(属性 事件)-------------使用DIV兼容IE FF思路如此,我写过一个书目生成器,和你这个原理一样 如何用DOM加入新的 ul? 如何实现用户点“浏览”选择完文件后,自动开始上传 我按照 教程 写了 一个 EXT 2.0 grid 的例子 但什么也没有显示 这个功能如何实现,求各位大哥帮忙? 求鼠标右键弹出菜单完整代码 (要求不被option-select覆盖)小弟就10分了 这个js函数怎么没用? 关于取得cookie值的问题,谁能帮帮我啊,急啊,在线等!!!! 请问一个ActiveDocument问题 关于hidden的传值问题 求注册表修改程序, ie无法显示出网页,但是Myeclipse和FF能显示出来 insertCell 添加的只是个TD , 如何动态添加TH ?
那数量就变成多个了
怎么识别
小计[i].value=数量[i].value*单价[i].value
for(var i=1,i<oTable.rows.count;i++)
{
var oNub = oTable.rows[i].cells[3].firstChild;//数量(表格第4列单元格中的第一个对象)
var oUnit = oTable.rows[i].cells[4].firstChild;//单价
var oTatal = oTable.rows[i].cells[5].firstChild;//总价
oTatal.value = parseFloat(oNub.value)*parseFloat(oNub.value);
}
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>test</title>
<script>
function getTotal(obj,index)
{
//这里可以对obj.value做校验
//index为1的时候,符点数
//index为2的时候,整数
var td1,td2,td3;
if(index==1){
td1 = obj.parentNode;
td2 = td1.nextSibling;
}else{
td2 = obj.parentNode;
td1 = td2.previousSibling;
}
td3 = td2.nextSibling;
if(td1.firstChild.value!=""&&td2.firstChild.value!="")
{
td3.firstChild.value=parseFloat(td1.firstChild.value)*parseInt(td2.firstChild.value);
}
}</script>
</head>
<body>
<table border="1" width="48%">
<tr>
<td align="center">单价</td>
<td align="center">数量</td>
<td align="center">小计</td>
</tr>
<tr>
<td><input type="text" value="" onblur="getTotal(this,1)"> </td>
<td><input type="text" value="" onblur="getTotal(this,2)"> </td>
<td><input type="text" value=""> </td>
</tr>
<tr>
<td><input type="text" value="" onblur="getTotal(this,1)"> </td>
<td><input type="text" value="" onblur="getTotal(this,2)"> </td>
<td><input type="text" value=""> </td>
</tr>
<tr>
<td><input type="text" value="" onblur="getTotal(this,1)"> </td>
<td><input type="text" value="" onblur="getTotal(this,2)"> </td>
<td><input type="text" value=""> </td>
</tr>
</table>
</body>
</html>
function calculate(index){
if(!index){alert("参数错误!");return;}
var p=document.getElementById('p'+index);
var q=document.getElementById('q'+index);
//这里做数字验证,省略
var subtotal=p*q;
document.getElementById('s'+index).value=subtotal;//小计
//合计:
var total=0;
for (....){
total+=document.getElementById('s'+index).value
}
document.getElementById('合计的文本框id').value=total
}
</script><table border="1" width="48%">
<tr>
<td align="center">单价</td>
<td align="center">数量</td>
<td align="center">小计</td>
</tr>
<tr ln=1>
<td><input type="text" id=p0 name=p value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td>
<td><input type="text" id=q0 name=q value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td>
<td><input type="text" id=s0 name=s value=""> </td>
</tr>
<tr ln=2>
<td><input type="text" id=p1 name=p value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td>
<td><input type="text" id=q1 name=q value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td>
<td><input type="text" id=s1 name=s value=""> </td>
</tr>
<tr ln=3>
<td><input type="text" id=p2 name=p value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td>
<td><input type="text" id=q2 name=q value="" onpropertychange="calculate(this.parentNode.parentNode.ln-1);"> </td>
<td><input type="text" id=s2 name=s value=""> </td>
</tr>
</table>如果动态插入行,注意加TR的 ln属性,且默认数量和价格的文本框value=0
删除行时,要重新排列各个控件的idy以及TR的 ln属性值,不然就乱套了
类似这种行操作的,建议尽量不要加入一些计数标志位,代码量大的话容易混淆
1,获取父节点的对象数组(关键在于 var os = obj.parentNode.getElementsByTagName("td"))
2,根据顺序来计算小计的值 (os[i].value*os[j].value)
而且,输入过程中即可看见结果变化,即输即算,反应很快的,可以和7楼对比下。
用了ie里的expression魔法。<html>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>test</title>
<style type="text/css">
input.X {
width:30px; text-align:center; border:none;
x:expression(this.value==parentNode.parentNode.rowIndex+'' || (this.value=parentNode.parentNode.rowIndex,readOnly=true));
}
input.A {
text-align:center; x:expression((this.value==this.value2) || MUL(this));
}
input.Z {
text-align:center;
}
</style>
<script>
function MUL(obj)
{
var row=obj.parentNode.parentNode;
var a=parseFloat(row.cells(1).firstChild.value);
var b=parseFloat(row.cells(2).firstChild.value);
var c=((isNaN(a)||isNaN(b))?'':((a*b)+''));
if(c!='' && c.search(/\..*?0{4,}1$/)>0)c=c.replace(/0{4,}1$/,'');
if(c!='' && c.search(/\..*?9{4,}[89]$/)>0){
c=c.replace(/9{4,}[89]$/,'');
var tail=c.charAt(c.length-1);
if(tail=='.')c=c.substring(0,c.length-1)
c = c.indexOf('.')>=0 ? c.substring(0,c.length-1)+(eval(tail)+1) : (eval(c)+1)+'';
}
if(typeof(obj.value2)!='string'||obj.value2!=obj.value){
obj.value2=obj.value; row.cells(3).firstChild.value=c;
}
return c;
}
function del(row){
if(TBODY1.rows.length>2){row.removeNode(true);}
}
function add(){
var tr=TBODY1.insertRow();
tr.insertCell().innerHTML='<input class="X">';
tr.insertCell().innerHTML='<input class="A">';
tr.insertCell().innerHTML='<input class="A">';
tr.insertCell().innerHTML='<input class="Z">';
tr.insertCell().innerHTML='<input type="button" value="删除" onclick="del(parentNode.parentNode)">';
}
</script>
</head>
<body onload="for(var i=0;i<5;i++)add();"><table border="1" width="48%">
<col align="center"><col align="center"><col align="center"><col align="center"><col align="center">
<tbody id="TBODY1">
<tr>
<td> </td>
<td>单价</td>
<td>数量</td>
<td>小计</td>
<td><input type="button" value="添加" onclick="add()"></td>
</tr>
<tr>
<td><input class="X"></td>
<td><input class="A"></td>
<td><input class="A"></td>
<td><input class="Z"></td>
<td><input type="button" value="删除" onclick="del(parentNode.parentNode)"></td>
</tr>
</tbody>
</table></body>
</html>
==>Array---Object---(属性 事件)-------------使用DIV兼容IE FF
思路如此,我写过一个书目生成器,和你这个原理一样