JavaScript controls the non-display of a column in a table
This article mainly introduces how to control the non-display of a column in a table using JavaScript. It involves the javascript operation form technique and is very useful. If you need it, refer
This example describes how to use JavaScript to control the non-display of a column in a table. Share it with you for your reference. The specific implementation method is as follows:
1. table Code
The Code is as follows:
<Table id = "mytable" border = "0" width = "1400" align = "center"
Cellpadding = "3" cellspacing = "1" bgcolor = "# dfdfdf">
<Tbody id = "tbody1" style = "background: # e4e9f0; font-weight: bold;">
<Tr class = "gray12">
<Td width = "120" bgcolor = "# FFFFFF"> date </td>
<Td width = "120" bgcolor = "# FFFFFF"> media name </td>
<Td width = "200" bgcolor = "# FFFFFF"> serving form </td>
<Td width = "120" bgcolor = "# FFFFFF"> Number of exposures </td>
<Td width = "120" bgcolor = "# FFFFFF"> Number of people exposed </td>
<Td width = "120" bgcolor = "# FFFFFF"> Number of clicks </td>
<Td width = "120" bgcolor = "# FFFFFF"> Number of clicks </td>
<Td width = "120" bgcolor = "# FFFFFF"> CTR </td>
<Td width = "120" bgcolor = "# FFFFFF"> visits </td>
<Td width = "120" bgcolor = "# FFFFFF"> bounce Times </td>
<Td width = "120" bgcolor = "# FFFFFF"> access depth </td>
<Td width = "120" bgcolor = "# FFFFFF"> browsing duration/second </td>
<Td width = "120" bgcolor = "# FFFFFF"> participants </td>
<Td width = "120" bgcolor = "# FFFFFF"> Number of people handling services </td>
</Tr>
</Tbody>
<Tbody id = "detail_id"> </tbody>
</Table>
2. js permission Control
Note: if the data is dynamic data, control the display of td after the assignment is complete. Otherwise, the td header is successfully controlled and other rows fail.
?
1 2 3 4 5 6 7 8 9 10 11 |
If (uname = "guest "){ $ ("# Mytable tr"). each (function (){ $ (This). find ("td" ).eq(7).css ("display", "none "); $ (This). find ("td" ).eq(8).css ("display", "none "); $ (This). find ("td" ).eq(9).css ("display", "none "); $ (This). find ("td" ).eq(10).css ("display", "none "); $ (This). find ("td" 2.16.eq(112.16.css ("display", "none "); $ (This). find ("td" 2.16.eq(122.16.css ("display", "none "); $ (This). find ("td" ).eq(132.16.css ("display", "none "); }); } |
I hope this article will help you design javascript programs.