所以我有这段代码来生成发票:
.table-data_2{
padding: 0;
margin: 0 auto 1.5em auto;
border-top: 0px solid #C1DAD7;
border-left: 0px solid #C1DAD7;
border-collapse:collapse;
font-size:12px;
font-family: verdana,arial,sans-serif;
color:#545454;
border: 0;
}
.td-data_1 {
font: normal 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
padding: 3px 6px 3px 6px;
color: #4f6b72;
border: 2;
text-align: left;
}
<table class="table-data_2" id="tbl_po">
<tr>
<td bgcolor="#8eb4e3" class="td-data_1" width=30><font size="2dp"><div align="center">NO </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=80><font size="2dp"><div align="center"> Q-Code </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=450><font size="2dp"><div align="center"> Name, Spec, Size </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=50><font size="2dp"><div align="right"> QTY </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=50><font size="2dp"><div align="center"> Unit </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=50><font size="2dp"><div align="center"> Currency </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=80><font size="2dp"><div align="right"> Unit Price </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=80><font size="2dp"><div align="right"> Total Price </div></font></td>
</tr>
<tr>
<td align="center"><font size="2dp"> 1 </font></td>
<td align="left"><font size="2dp"> Data Not Shown </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="right"><font size="2dp"> 2 </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="right"><font size="2dp"> 12000 </font></td>
<td align="right" class="total_price"><font size="2dp"> 24000 </font></td>
</tr>
<tr>
<td align="center"><font size="2dp"> 1 </font></td>
<td align="left"><font size="2dp"> Data Not Shown </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="right"><font size="2dp"> 2 </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="right"><font size="2dp"> 14000 </font></td>
<td align="right" class="total_price"><font size="2dp"> 28000 </font></td>
</tr>
<tr>
<td colspan='7' class='text-right'>Sub total</td>
<td class="sub_total">SUM TOTAL PRICE</td>
</tr>
<tr>
<td colspan='7' class='text-right'>VAT</td>
<td class='text-right'>10%</td>
</tr>
<tr>
<td colspan='7' class='text-right'><b>TOTAL</b></td>
<td class='text-right'><b>TOTAL + VAT</b></td>
</tr>
</table>
我想生成我的表中显示的总价的小计(不是从mysql数据库),以及如何从小计+增值税中生成值?
任何帮助都感激不尽。
谢谢,
最佳答案
尝试这个:
$('document').ready(function() {
var ttl = 0;
$.each($('td.total_price'), function(key, value) {
ttl += parseInt($(value).text()) || 0;
});
var vat = 10;
var cVat = (ttl * vat) / 100;
$('td.sub_total').html('<strong>' + ttl + '</strong>');
$('td.vat').html('<strong>' + cVat + '</strong>');
$('td.total').html('<strong>' + (ttl + cVat) + '</strong>');
});
.table-data_2{
padding: 0;
margin: 0 auto 1.5em auto;
border-top: 0px solid #C1DAD7;
border-left: 0px solid #C1DAD7;
border-collapse:collapse;
font-size:12px;
font-family: verdana,arial,sans-serif;
color:#545454;
border: 0;
}
.td-data_1 {
font: normal 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
padding: 3px 6px 3px 6px;
color: #4f6b72;
border: 2;
text-align: left;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table-data_2" id="tbl_po">
<tr>
<td bgcolor="#8eb4e3" class="td-data_1" width=30><font size="2dp"><div align="center">NO </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=80><font size="2dp"><div align="center"> Q-Code </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=450><font size="2dp"><div align="center"> Name, Spec, Size </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=50><font size="2dp"><div align="right"> QTY </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=50><font size="2dp"><div align="center"> Unit </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=50><font size="2dp"><div align="center"> Currency </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=80><font size="2dp"><div align="right"> Unit Price </div></font></td>
<td bgcolor="#8eb4e3" class="td-data_1" width=80><font size="2dp"><div align="right"> Total Price </div></font></td>
</tr>
<tr>
<td align="center"><font size="2dp"> 1 </font></td>
<td align="left"><font size="2dp"> Data Not Shown </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="right"><font size="2dp"> 2 </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="right"><font size="2dp"> 12000 </font></td>
<td align="right" class="total_price"><font size="2dp"> 24000 </font></td>
</tr>
<tr>
<td align="center"><font size="2dp"> 1 </font></td>
<td align="left"><font size="2dp"> Data Not Shown </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="right"><font size="2dp"> 2 </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="center"><font size="2dp"> Data Not Shown </font></td>
<td align="right"><font size="2dp"> 14000 </font></td>
<td align="right" class="total_price"><font size="2dp"> 28000 </font></td>
</tr>
<tr>
<td colspan='7' class='text-right'>Sub total</td>
<td class="sub_total">SUM TOTAL PRICE</td>
</tr>
<tr>
<td colspan='7' class='text-right'>VAT</td>
<td class='text-right vat'>10%</td>
</tr>
<tr>
<td colspan='7' class='text-right'><b>TOTAL</b></td>
<td class='text-right total'><b>TOTAL + VAT</b></td>
</tr>
</table>
关于javascript - 汇总表列的所有行[HTML,JavaScript],我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38603691/