直接记录下上代码
HTML
<table id="table0" name="table0" border="1" cellspacing="" cellpadding="" style="widtd:100%;border:1px solid #000"> <tr> <td style=" 90px;"><label class="font36">申购部门</label></td> <td colspan="2"> <div class="car_num"style="height: 40px;" onclick="diaDepaPer(9)"> <a class="mui-icon mui-icon-arrowdown" style="padding: 0px;margin: 10px 3px 0 0;float: right;color: #000;" ></a> <span id="met_company" class="fl "style="color: #8F8F94;font-size: 14px;line-height: 40px;">未选择</span> </div> </td> <td style=" 60px;"><label class="font36">申购人</label></td> <td > <div id="" class="fr met-per" style=""> <a class="mui-icon mui-icon-arrowdown "style="margin:10px 0px 0px 0px;color: #000;float: right; " onclick="diaDepaPer(10)"></a> <div class="div_xrx" id="relateduni" style=""> <label class="label_z" style="line-height: 40px;color: #8F8F94;margin-left: 2px;font-size: 14px;">未选择</label> </div> </div> </td> </tr> <tr> <td colspan="2"><label class="font36">部门财务审签人</label></td> <td colspan="3"> <div id="" class="fr met-per" style=""> <a class="mui-icon mui-icon-arrowdown "style="margin:10px 0px 0px 0px;color: #000;float: right; " onclick="diaDepaPer(11)"></a> <div class="div_xrx" id="relateduni2" style=""> <label class="label_z" style="line-height: 40px;color: #8F8F94;margin-left: 2px;font-size: 14px;">未选择</label> </div> </div> </td> </tr> <tr><td colspan="6" class="font36" style="text-align: center; height: 40px;line-height: 40px;">申购物品</td></tr> <tr style="widtd:100%;height: 40px;line-height: 40px;background-color: #fff;"> <td class="td name_0" style="widtd: 30%;">名称</td> <td class="td name_1" style="widtd: 30%;">规格型号</td> <td class="td name_2" style="widtd: 10%;">数量</td> <td class="td name_3" style="widtd: 10%;">单价(元)</td> <td class="td name_4" style="widtd: 10%;">金额(元)</td> </tr> <tr class="trs"> <td><textarea class="textareas add1 suppliesName" type="text"></textarea></td> <td><textarea class="textareas add2 specificationModel" type="text"></textarea></td> <td class="num-pallets"><input class="inputs num num-pallets-input" type="number"/></td> <td class="price-per-pallet"><input class="inputs price" type="number" /></td> <td class="row-total"><input class="inputs money row-total-input" type="number" disabled="disabled"/></td> </tr> <tr class="trs"> <td><textarea class="textareas add1 suppliesName" type="text" name="homeDuty" style="" placeholder=""></textarea></td> <td><textarea class="textareas add1 specificationModel" type="text" name="homeDuty" style="" placeholder=""></textarea></td> <td class="num-pallets"><input class="inputs num num-pallets-input" type="number" name="num" id="num" style=""placeholder=""/></td> <td class="price-per-pallet"><input class="inputs price" type="number" name="price" id="price" placeholder=""/></td> <td class="row-total"><input class="inputs money row-total-input" type="number" name="money" id="money" disabled="disabled"/></td> </tr> <tr class="trs"> <td><textarea class="textareas add1 suppliesName" type="text" name="homeDuty" style="" placeholder=""></textarea></td> <td><textarea class="textareas add1 specificationModel" type="text" name="homeDuty" style="" placeholder=""></textarea></td> <td class="num-pallets"><input class="inputs num num-pallets-input" type="number" name="num" id="num" style=""placeholder=""/></td> <td class="price-per-pallet"><input class="inputs price" type="number" name="price" id="price" placeholder=""/></td> <td class="row-total"><input class="inputs money row-total-input" type="number" name="money" id="money" disabled="disabled"/></td> </tr> </table>
<tr > <td colspan="1" style=" 73px;border:1px solid #000;border-top: 0px;"><label class="font36">金额合计</label></td> <td colspan="3" style="border:1px solid #000;border-top: 0px;"><input class="inputs" type="text" name="homeDuty" id="totalMoney" style="" disabled="disabled"/></td> </tr>
js代码
//实时监测input中值的变化
$('input').bind('input propertychange', function(){
$(".trs").each(function (index, element) {
var num = $.trim($(this).find('.num').val());
var price = $.trim($(this).find('.price').val());
$(this).find('.money').val((num * price));
});
var money = 0;
$(".money").each(function(){
money+=(parseFloat($(this).val())?parseFloat($(this).val()):0);
});
$("#totalMoney").val(money);
});