Jquery method
Copy Code code as follows:
$(
function () {
Calculated staff Statistics totals when page loads
Calcsum ();
});
Total Row calculation
/*
In total behavior Intermediate variables
Add each cell to the column Total row
Get totals per column
*/
function trvisible (CHK, index) {
var Disvalue = $ ("#Tr" + index). CSS ("display");
if (chk.checked) {
$ ("#Tr" + index). CSS ("Display", "block");
}
else {
$ ("#Tr" + index). CSS ("display", "none");
}
Calcsum ();
}
function Calcsum () {
Total row Assignment Initial value 0
$ ("#trSum"). each (function () {
$ (this). FIND ("TD"). each (function () {
if ($ (this). Index ()!= 0) {
$ (this). Text ("0");
}
});
});
$ ("#tabrytj"). Find ("tr"). each (function () {
var Trdis = $ (this). CSS ("display");
Hidden rows do not participate in calculations
if (Trdis = = "Block") {
$ (this). FIND ("TD"). each (function () {
var index = $ (this). index ();
if (index >= 1) {
var Tdvalue = $ ("#trSum"). Find ("Td:eq + Index +"). Text ();
TotalSum + = parsefloat ($ (this). text ());
$ ("#trSum"). Find ("Td:eq (" + index +) "). Text (parsefloat (tdvalue) + parsefloat ($ (this). text ());
}
});
}
});
}
HTML statements
Copy Code code as follows:
<table>
<tr>
<td> Branch </td>
<td>
<select>
<option>
South China Branch
</option>
</select>
</td>
<td><input type= "checkbox" onclick= "Trvisible (this,1)" Name= "Chk1" id= "Chk1" checked= "checked"/> Zhang 1</ Td>
<td><input type= "checkbox" onclick= "Trvisible (this,2)" checked= "checked"/> Zhang 2</td>
<td><input type= "checkbox" onclick= "Trvisible (this,3)" checked= "checked"/> Zhang 3</td>
<td><input type= "checkbox" onclick= "Trvisible (this,4)" checked= "checked"/> Zhang 4</td>
<td><input type= "checkbox" onclick= "Trvisible (this,5)" checked= "checked"/> Zhang 5</td>
<td><input type= "checkbox" onclick= "Trvisible (this,6)" checked= "checked"/> Zhang 6</td>
</tr>
</table>
<div>
<table border= "0" class= "tableinfo" id= "TABRYTJ" >
<tr id= "Tr1" style= "Display:block" >
<td> Zhang 1 </td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
</tr>
<tr id= "TR2" style= "Display:block" >
<td> Zhang 2 </td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
</tr>
<tr id= "Tr3" style= "Display:block" >
<td> Zhang </td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
<td>124536</td>
</tr>
<tr id= "Trsum" >
<td></td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
</table>
</div>
