jquery关于金额计算的问题 统计 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 改了下你的结构,方便操作。。自己研究下<!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=gb2312" /><title>javascript -TAG---and---焦点图-</title><style type="text/css">body{ padding: 0; margin: 0;} body{ font-size: 12px; font-family: "微软雅黑";} ul,ol{ margin: 0px; padding: 0; list-style: none;} h2{ padding-left: 20px;}a{ text-decoration: none;}/*CSS*/.oa_extra_work .table_extra_work{ width:70%; border: 1px solid #ccc;}.table_extra_work tr th{white-space:nowrap; padding: 0 5px;}.table_extra_work tr th,.table_extra_work tr td{ text-align: center; border: 1px solid #ccc;}.table_extra_work tr td{white-space: nowrap;padding: 0 5px;}.table_extra_work tr td .extra_work,.table_extra_work tr td .chalv_work,.table_extra_work tr td .lixiang_work{width: 120px;border: 0 none; text-align: center;}.table_extra_work tr td .countTime,.table_extra_work tr td .timeD{ width: 80px;}.table_extra_work tr td .shiyou{ width:99%; min-width:400px;+width:400px;} ;.table_extra_work tr td .timeD{}.table_extra_work tr td .del,.table_extra_work tr td .nodel{width: 50px;height: 25px;line-height: 25px; color: #fff;background: #27A9E3;display: block;margin: 0 auto;text-align: center;}.table_extra_work tr td .nodel{background:none;}.table_extra_work tr td .work_td_shiyou{display: block;width: 450px;height: 29px;line-height: 29px;overflow: auto;white-space: normal;}.extra_work_addLine,.layout_right_main .addLinesq{ border: 0 none; height: 29px; line-height: 29px; cursor: pointer; background: #27A9E3; color: #fff; margin-left: 0px; margin-top: 10px;}.zhuming{padding: 10px 0; font-size: 13px;}</style><script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script><script type="text/javascript"> function OnInput(e) { var tbody = $(e.target || e.srcElement).closest('tbody'), sum = 0; tbody.find('input').each(function () { sum += parseFloat(this.value) || 0 }); tbody.find('td:last span').html(sum.toFixed(2)); sum = 0; $('#J_Lx_table span.xiaoji').each(function () { sum += parseFloat(this.innerHTML) || 0; }); $('#tdTotal').html(sum.toFixed(2)); } $(function () { //TODO 培训项目立项申请 var curLxIndex = 0; $(document).on("click", "#J_lixiang_addLine", function () { curLxIndex++; var LxStr = '<tbody><tr height="32" class="num_' + curLxIndex + '"><th>场次</th><th>交通费(元)</th><th>住宿费(元)</th><th>餐费</th><th>物料费</th><th>操作</th></tr>'; LxStr += '<tr height="29" class="num_' + curLxIndex + '"><td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>'; LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>'; LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>'; LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(this)" /></td>'; LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event);" /></td>'; LxStr += '<td rowspan="3"><a href="javascript:;" class="del">删除</a></td></tr>'; LxStr += '<tr height="32" class="num_' + curLxIndex + '"><th>课酬费</th><th>培训手册费</th><th>场地费</th><th>其他费用</th><th>合计</th></tr>'; LxStr += '<tr height="29" class="num_' + curLxIndex + '"><td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>'; LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>'; LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>'; LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>'; LxStr += '<td width="5%"><span class="xiaoji">123</span></td>'; LxStr += '</tr></tbody>'; //填充 $("#tbTotal").before(LxStr); }) //TODO 培训项目立项申请 删除效果 $(document).on("click", "#J_Lx_table a.del", function () { var _this = $(this); //获取当前点击的 class var curClass = _this.closest("tr").attr("class"); _this.closest("table").find("." + curClass).remove(); }) })</script> </head> <body> <!--table--> <div class="oa_extra_work pl10"> <table border="0" style="width: 800px;margin-left: 110px;;" class="table_extra_work" id="J_Lx_table" cellpadding="0" cellspacing="0"><tbody> <tr height="32" class="num_0"><th>场次</th><th>交通费(元)</th><th>住宿费(元)</th><th>餐费</th><th>物料费</th><th>操作</th></tr> <tr height="29" class="num_0"> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(this)" /></td> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event);" /></td> <td rowspan="3"><a href="javascript:;" class="del">删除</a></td> </tr> <tr height="32" class="num_0"><th>课酬费</th><th>培训手册费</th><th>场地费</th><th>其他费用</th><th>合计</th></tr> <tr height="29" class="num_0"> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td> <td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td> <td width="5%"><span class="xiaoji">123</span></td> </tr></tbody> <tbody id="tbTotal"> <tr height="29" id="J_Lx_Total"><td>合计金额(小写):</td><td id="tdTotal">12352.04</td><td>合计金额(大写):</td><td colspan="3"><span>壹万贰仟叁佰伍拾贰圆零肆分</span></td></tr></tbody> </table> <input type="button" value="新增一行" class="extra_work_addLine clearfix" id="J_lixiang_addLine" style="margin-left: 110px; margin-bottom: 10px;" /> </div> <!--table end--> </body></html> 关于WEB UI讨论贴 创建随即数 怎样用Jquery实现当鼠标指到html表格的一个单元格时,该单元格所在的行列的颜色均变化? 在检验表单输入时,为什么弹不出错误信息 什么不填写 提交了反而 提示注册成功!!! 读取多个JSON文件,把结果存储到数组 请问JAVA的问题 无边框窗口怎么做,能在IE6下显示? 有关iFrame 怎样模拟按下某组合键!!!!!! 谁有YAHOO的资料 几个this的当前域不解 JS控制根据所传数据选中多选按钮
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>javascript -TAG---and---焦点图-</title>
<style type="text/css">
body{ padding: 0; margin: 0;}
body{ font-size: 12px; font-family: "微软雅黑";}
ul,ol{ margin: 0px; padding: 0; list-style: none;}
h2{ padding-left: 20px;}
a{ text-decoration: none;}
/*CSS*/
.oa_extra_work .table_extra_work{ width:70%; border: 1px solid #ccc;}
.table_extra_work tr th{white-space:nowrap; padding: 0 5px;}
.table_extra_work tr th,.table_extra_work tr td{ text-align: center; border: 1px solid #ccc;}
.table_extra_work tr td{white-space: nowrap;padding: 0 5px;}
.table_extra_work tr td .extra_work,.table_extra_work tr td .chalv_work,.table_extra_work tr td .lixiang_work{width: 120px;border: 0 none; text-align: center;}
.table_extra_work tr td .countTime,.table_extra_work tr td .timeD{ width: 80px;}
.table_extra_work tr td .shiyou{ width:99%; min-width:400px;+width:400px;} ;
.table_extra_work tr td .timeD{}
.table_extra_work tr td .del,.table_extra_work tr td .nodel{width: 50px;height: 25px;line-height: 25px; color: #fff;background: #27A9E3;display: block;margin: 0 auto;text-align: center;}
.table_extra_work tr td .nodel{background:none;}
.table_extra_work tr td .work_td_shiyou{display: block;width: 450px;height: 29px;line-height: 29px;overflow: auto;white-space: normal;}
.extra_work_addLine,.layout_right_main .addLinesq{ border: 0 none; height: 29px; line-height: 29px; cursor: pointer; background: #27A9E3; color: #fff; margin-left: 0px; margin-top: 10px;}
.zhuming{padding: 10px 0; font-size: 13px;}
</style>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
function OnInput(e) {
var tbody = $(e.target || e.srcElement).closest('tbody'), sum = 0;
tbody.find('input').each(function () { sum += parseFloat(this.value) || 0 });
tbody.find('td:last span').html(sum.toFixed(2));
sum = 0;
$('#J_Lx_table span.xiaoji').each(function () { sum += parseFloat(this.innerHTML) || 0; });
$('#tdTotal').html(sum.toFixed(2));
}
$(function () {
//TODO 培训项目立项申请
var curLxIndex = 0;
$(document).on("click", "#J_lixiang_addLine", function () {
curLxIndex++;
var LxStr = '<tbody><tr height="32" class="num_' + curLxIndex + '"><th>场次</th><th>交通费(元)</th><th>住宿费(元)</th><th>餐费</th><th>物料费</th><th>操作</th></tr>';
LxStr += '<tr height="29" class="num_' + curLxIndex + '"><td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>';
LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>';
LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>';
LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(this)" /></td>';
LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event);" /></td>';
LxStr += '<td rowspan="3"><a href="javascript:;" class="del">删除</a></td></tr>';
LxStr += '<tr height="32" class="num_' + curLxIndex + '"><th>课酬费</th><th>培训手册费</th><th>场地费</th><th>其他费用</th><th>合计</th></tr>';
LxStr += '<tr height="29" class="num_' + curLxIndex + '"><td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>';
LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>';
LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>';
LxStr += '<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>';
LxStr += '<td width="5%"><span class="xiaoji">123</span></td>';
LxStr += '</tr></tbody>';
//填充
$("#tbTotal").before(LxStr); }) //TODO 培训项目立项申请 删除效果
$(document).on("click", "#J_Lx_table a.del", function () {
var _this = $(this);
//获取当前点击的 class
var curClass = _this.closest("tr").attr("class");
_this.closest("table").find("." + curClass).remove(); })
})
</script>
</head>
<body>
<!--table-->
<div class="oa_extra_work pl10">
<table border="0" style="width: 800px;margin-left: 110px;;" class="table_extra_work" id="J_Lx_table" cellpadding="0" cellspacing="0"><tbody>
<tr height="32" class="num_0"><th>场次</th><th>交通费(元)</th><th>住宿费(元)</th><th>餐费</th><th>物料费</th><th>操作</th></tr>
<tr height="29" class="num_0">
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(this)" /></td>
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event);" /></td>
<td rowspan="3"><a href="javascript:;" class="del">删除</a></td>
</tr>
<tr height="32" class="num_0"><th>课酬费</th><th>培训手册费</th><th>场地费</th><th>其他费用</th><th>合计</th></tr>
<tr height="29" class="num_0">
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>
<td width="5%"><input type="text" class="lixiang_work" name="" value="" onkeyup="OnInput(event)" /></td>
<td width="5%"><span class="xiaoji">123</span></td>
</tr></tbody>
<tbody id="tbTotal">
<tr height="29" id="J_Lx_Total"><td>合计金额(小写):</td><td id="tdTotal">12352.04</td><td>合计金额(大写):</td><td colspan="3"><span>壹万贰仟叁佰伍拾贰圆零肆分</span></td></tr></tbody>
</table>
<input type="button" value="新增一行" class="extra_work_addLine clearfix" id="J_lixiang_addLine" style="margin-left: 110px; margin-bottom: 10px;" />
</div>
<!--table end-->
</body>
</html>