请帮忙给我写下面表格在HTML5中用JS代码计算小计和总金额的程序代码！谢谢了！急急急急急急！！！！！！
1个回答
展开全部
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Details</title>
<style>
*{
margin:0;
}
table{
margin:auto;
width: 800px;
border: 1px solid black;
border-collapse:collapse;
}
caption{
text-align:left;
font: bolder 22px consolas;
}
th{
background-color:red;
}
th,td{
text-align:center;
border:1px solid black;
}
td>input[type=text]{
width:50px;
text-align:center;
}
</style>
<script>
onload = function(){
var tbody = tab.tBodies[0];
var rows = tbody.rows;
var texts = tbody.getElementsByTagName("input");
for(var i = 0; i < texts.length; i++){
var ti = texts[i];
ti.onkeyup = function(){
var me = this;
var dom = me.parentElement.nextElementSibling;
var price = dom.innerHTML.replace(/[^\d\.]/g,"");
var total = dom.nextElementSibling;
total.innerHTML = "$" + (me.value * price).toFixed(2);
var t = 0;
for(var i = 1; i < rows.length - 1; i++){
var td = rows[i].cells[4].innerHTML.replace(/[^\d\.]/g,"");
t += td * 1;
}
sum.innerHTML = "$" + t.toFixed(2);
}
}
}
</script>
</head>
<body>
<table id="tab">
<caption>Order Details</caption>
<tr>
<th>Product Code</th>
<th>Decription</th>
<th>Qty</th>
<th>Price</th>
<th>Total</th>
</tr>
<tr>
<td>COMP001</td>
<td>The Ultimate Smartphone</td>
<td><input type="text" /></td>
<td>$399.99</td>
<td>$0.00</td>
</tr>
<tr>
<td>COMP002</td>
<td>The Ultimate Tablet</td>
<td><input type="text" /></td>
<td>$299.99</td>
<td>$0.00</td>
</tr>
<tr>
<td>COMP003</td>
<td>The Ultimate Netbook</td>
<td><input type="text" /></td>
<td>$499.99</td>
<td>$0.00</td>
</tr>
<tr>
<td colspan=4 style="text-align:right;">Order Total</td>
<td id="sum">$0.00</td>
</tr>
</table>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
