87,989
社区成员
发帖
与我相关
我的任务
分享JS焦点事件改为直接运行或按钮运行
现在这段代码都是需要点击文本框后能计算出数值，由于调用数据库，会有多行数据，每行点击一次，非常麻烦，如何可以直接自动运算所有行，或者添加个点击按钮来进行运算。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RunJS 演示代码</title>
<script>
onload = function() {
var tb = document.getElementById("tb");
var trs = tb.rows;
for (var i = 0; i < trs.length; i++) {
var tds = trs[i].cells;
for (var j = 1; j < tds.length; j++) {
var txt = tds[j].children[0];
if (null != txt && txt.type == 'text') {
if (j > 2 || i == trs.length - 1) {
txt.setAttribute("readonly", true);
} else {
txt.ind = j;
txt.onkeyup = txt.onfocus = function() {
var row = this.parentElement.parentElement;
var c = row.cells;
var sum = (c[1].children[0].value * 1 + c[2].children[0].value * 1);
var sf = sum * 0.03;
c[3].children[0].value = sf.toFixed(2);
c[4].children[0].value = sum.toFixed(2);
c[5].children[0].value = (sf + sum).toFixed(2);
var cc = trs[trs.length - 1].cells;
var total = 0;
for (var k = 1; k < trs.length - 1; k++) {
total += trs[k].cells[this.ind].children[0].value * 1;
}
cc[this.ind].children[0].value = total;
sum = (cc[1].children[0].value * 1 + cc[2].children[0].value * 1);
sf = sum * 0.03;
cc[3].children[0].value = sf.toFixed(2);
cc[4].children[0].value = sum.toFixed(2);
cc[5].children[0].value = (sf + sum).toFixed(2);
}
}
}
}
}
}
</script>
</head>
<body>
<table id="tb" width="1000" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="200" align="center">姓名</td>
<td width="200" align="center">保险</td>
<td width="200" align="center">工资</td>
<td width="200" align="center">税费</td>
<td width="200" align="center">工资保险合计</td>
<td width="200" align="center">工资、保险、税费合计</td>
</tr>
<tr>
<td width="200" align="center">张三</td>
<td width="200" align="center">
<input name="bx" type="text" id="bx" value="1500">
</td>
<td width="200" align="center">
<input name="gz1" type="text" id="gz1" value="2000">
</td>
<td width="200" align="center">
<input type="text" name="sf1" id="sf1">
</td>
<td width="200" align="center">
<input type="text" name="gzbxhj1" id="gzbxhj1">
</td>
<td width="200" align="center">
<input type="text" name="gzbxsfhj1" id="gzbxsfhj1">
</td>
</tr>
<tr>
<td width="200" align="center">李四</td>
<td width="200" align="center">
<input name="bx" type="text" id="bx" value="1460">
</td>
<td width="200" align="center">
<input name="gz2" type="text" id="gz2" value="2500">
</td>
<td width="200" align="center">
<input type="text" name="sf2" id="sf2">
</td>
<td width="200" align="center">
<input type="text" name="gzbxhj2" id="gzbxhj2">
</td>
<td width="200" align="center">
<input type="text" name="gzbxsfhj2" id="gzbxsfhj2">
</td>
</tr>
<tr>
<td width="200" align="center" bgcolor="#0066FF">合计</td>
<td width="200" align="center" bgcolor="#0066FF">
<input name="bxhj" type="text" id="bxhj">
</td>
<td width="200" align="center" bgcolor="#0066FF">
<input name="gzhj" type="text" id="gzhj">
</td>
<td width="200" align="center" bgcolor="#0066FF">
<input type="text" name="sfsj" id="sfsj">
</td>
<td width="200" align="center" bgcolor="#0066FF">
<input type="text" name="gzbxhjhj" id="gzbxhjhj">
</td>
<td width="200" align="center" bgcolor="#0066FF">
<input type="text" name="gzbxsfhjhj" id="gzbxsfhjhj">
</td>
</tr>
</table>
</body>
</html>
...全文
请发表友善的回复…
发表回复
天际的海浪 2017-11-19
- 打赏
- 举报
onload = function() {
var tb = document.getElementById("tb");
var trs = tb.rows;
for (var i = 0; i < trs.length; i++) {
var tds = trs[i].cells;
for (var j = 1; j < tds.length; j++) {
var txt = tds[j].children[0];
if (null != txt && txt.type == 'text') {
if (j > 2 || i == trs.length - 1) {
txt.setAttribute("readonly", true);
} else {
txt.ind = j;
txt.onkeyup = txt.onfocus = function() {
var row = this.parentElement.parentElement;
var c = row.cells;
var sum = (c[1].children[0].value * 1 + c[2].children[0].value * 1);
var sf = sum * 0.03;
c[3].children[0].value = sf.toFixed(2);
c[4].children[0].value = sum.toFixed(2);
c[5].children[0].value = (sf + sum).toFixed(2);
var cc = trs[trs.length - 1].cells;
var total = 0;
for (var k = 1; k < trs.length - 1; k++) {
total += trs[k].cells[this.ind].children[0].value * 1;
}
cc[this.ind].children[0].value = total;
sum = (cc[1].children[0].value * 1 + cc[2].children[0].value * 1);
sf = sum * 0.03;
cc[3].children[0].value = sf.toFixed(2);
cc[4].children[0].value = sum.toFixed(2);
cc[5].children[0].value = (sf + sum).toFixed(2);
}
txt.onkeyup();
}
}
}
}
}
囧 2017-11-19
- 打赏
- 举报
初始化的时候计算一下
function cal(txt, trs, ind){
var row = txt.parentElement.parentElement;
var c = row.cells;
var sum = (c[1].children[0].value * 1 + c[2].children[0].value * 1);
var sf = sum * 0.03;
c[3].children[0].value = sf.toFixed(2);
c[4].children[0].value = sum.toFixed(2);
c[5].children[0].value = (sf + sum).toFixed(2);
var cc = trs[trs.length - 1].cells;
var total = 0;
for (var k = 1; k < trs.length - 1; k++) {
total += trs[k].cells[ind].children[0].value * 1;
}
cc[ind].children[0].value = total;
sum = (cc[1].children[0].value * 1 + cc[2].children[0].value * 1);
sf = sum * 0.03;
cc[3].children[0].value = sf.toFixed(2);
cc[4].children[0].value = sum.toFixed(2);
cc[5].children[0].value = (sf + sum).toFixed(2);
}
onload = function() {
var tb = document.getElementById("tb");
var trs = tb.rows;
for (var i = 0; i < trs.length; i++) {
var tds = trs[i].cells;
for (var j = 1; j < tds.length; j++) {
var txt = tds[j].children[0];
if (null != txt && txt.type == 'text') {
if (j > 2 || i == trs.length - 1) {
txt.setAttribute("readonly", true);
} else {
txt.ind = j;
txt.onkeyup = txt.onfocus = function() {
cal(this, trs, this.ind);
}
cal(txt, trs, j);
}
}
}
}
}
