<html>
<head>
<title>texter</title>
<script type="text/javascript">
function $get(id){
return document.getElementById(id);
}
var table=null;
function caculPrice(){
var sum=0;
//注意这里要表格长度-1,因为总价哪一行并不参与计算,只显示结果
for(var i=0;i<table.rows.length-1;i++){
var price=parseFloat(table.rows[i].cells[0].innerHTML);//单价
var num=parseFloat(table.rows[i].cells[2].innerHTML);//数量
sum=price*num+sum;
}
$get('price').innerHTML=sum;
}
function delRow(id){
table=$get('mytable');
var row=$get(id);
table.deleteRow(row.rowIndex)
caculPrice();
}
</script>
</head>
<body>
<table id="mytable" border="1">
<tr id="tr1" >
<td>1888</td><td>sss</td><td>3</td><td οnclick="delRow('tr1')">删除</td>
</tr>
<tr id="tr2" >
<td>999</td><td>1888</td><td>4</td><td οnclick="delRow('tr2')">删除</td>
</tr>
<tr id="tr3" >
<td>9999</td><td>sssss</td><td>5</td><td οnclick="delRow('tr3')">删除</td>
</tr>
<tr id="tr" >
<td colspan="4" id="price">9999</td>
</tr>
</table>
</body>
</html>
一个简单的js事件,循环table并自动计算总价
最新推荐文章于 2024-06-21 15:37:00 发布