juery每行单价、数量、金额的计算

这段代码展示了如何使用jQuery监听输入框的焦点丢失和键盘按键事件,实时计算表格中每一行的单价、数量和总价,并在数量或单价改变时更新金额。同时,还提供了一个名为`fun`的函数来计算所有行的总金额。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

$(document).ready(function(){   

$('.number').die().live('focusout',function(){

$(this).parent().next().children().val('22');
$(this).parent().next().next().children().val('33');
$(this).parent().next().next().next().children().val('44');

});
//修改数量时,计算金额
$('.shuliang').die().live('keyup',function(){
var shuliang = parseFloat($(this).val()).toFixed(2);
var  danjia  = parseFloat($(this).parent().next().children().val()).toFixed(4);
var jine     = (danjia*shuliang).toFixed(4);
$(this).parent().next().next().children().val(jine)
fun();
});

//修改单价时,计算金额
$('.danjia').die().live('keyup',function(){
   var danjia = parseFloat($(this).val()).toFixed(4);
var shuliang = parseFloat($(this).parent().prev().children().val()).toFixed(2);//数量
var jine = (danjia*shuliang).toFixed(4);
$(this).parent().next().children().val(jine);
fun();

});
//计算所有分录的总金额
function fun(){
var temp = 0;
// var id = parseInt($(this).attr('id'));
$("input[id='totaljine']").each(function(){
//alert(id);

temp+= parseFloat($(this).val());
// alert($(this).val());
})
$(".totalMoney").val(temp);

}



//计算所有分录的折扣金额

//计算所有分录的实收金额


   
});   

</script>
</head>


<body>
  




<table>
<tr><td width='6%'><input type=text class='totalMoney' id='1' size='7' name="" /></td></tr>
 <tr class='biaoti' style="font-size:15px;" bgcolor="#38B0DE ">
<td width="5%" >物料编码</td>
<td width="7%" >物料名称</td>
<td width="7%" >规格型号</td>
<td width="7%" >计量单位</td>
<td width="5%" >数量</td>
<td width="10%">单位实际成本</td>
<td width="6%">实际成本</td>
<td width="5%">折扣金额</td>
<td width="5%">实收金额</td>
<td width="6%" >仓库</td>
<td width="6%" >备注</td>

<td width="6%">操作</td>
   </tr>
 <tr class='info'>
<td width='6%'><input type=text class='number' id='1' size='7' name="qtckentry.wlnumber" /></td>
<td width='6%'><input type=text class='item' id='2' size='7' name="qtckentry.wlname" /> </td>
<td width='6%'><input type=text class='item' id='3' size='7' name="qtckentry.ggxh" /></td>
<td width='6%'><input type=text class='item' id='4' size='7' name="qtckentry.jldanwei"/></td>

<td width='7%'><input type=text class='shuliang' id='5' size='8' name="qtckentry.shuliang" value='0'/></td>
<td width='7%'><input type=text class='danjia' id='8' size='8' name="qtckentry.dwsjcb" value='0'/></td>
<td width='6%'><input type=text class='jine' id='totaljine' size='8' name="qtckentry.sjcb" value='0'/></td>

<td width='6%'><input type=text class='item' id='10' size='8' name="qtckentry.hsdanjia"/></td>
<td width='6%'><input type=text class='item' id='11' size='8' name="qtckentry.bwdjine"/></td>
<td width='7%'><input type=text class='item' id='6' size='8' name="qtckentry.cangku" value='0'/></td>
<td width='7%'><input type=text class='item' id='7' size='8' name="qtckentry.beizhu"/></td>
<td><span id='delRow'>删除此行</span></td>
    </tr>

<tr class='info'>
<td width='6%'><input type=text class='number' id='1' size='7' name="qtckentry.wlnumber" /></td>
<td width='6%'><input type=text class='item' id='2' size='7' name="qtckentry.wlname" /> </td>
<td width='6%'><input type=text class='item' id='3' size='7' name="qtckentry.ggxh" /></td>
<td width='6%'><input type=text class='item' id='4' size='7' name="qtckentry.jldanwei"/></td>

<td width='7%'><input type=text class='shuliang' id='5' size='8' name="qtckentry.shuliang" value='0'/></td>
<td width='7%'><input type=text class='danjia' id='8' size='8' name="qtckentry.dwsjcb" value='0'/></td>
<td width='6%'><input type=text class='jine' id='totaljine' size='8' name="qtckentry.sjcb" value='0'/></td>


<td width='7%'><input type=text class='item' id='6' size='8' name="qtckentry.cangku" value='0'/></td>
<td width='7%'><input type=text class='item' id='7' size='8' name="qtckentry.beizhu"/></td>
<td width='6%'><input type=text class='item' id='10' size='8' name="qtckentry.hsdanjia"/></td>
<td width='6%'><input type=text class='item' id='11' size='8' name="qtckentry.bwdjine"/></td>
<td><span id='delRow'>删除此行</span></td>
    </tr>

</table>


</body>
</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值