有如下需求,需要控制一个table内几个tr的显示问题。一开始想的方法是在这几个要显示的tr外面套一个div,利用div的display:none属性来解决。 但是后来发现div和tr嵌套的时候会有问题。例如,如果我的html页面是这样的源码:
Html代码:
1 <head> 2 </head> 3 <body> 4 <table> 5 <div id="borrowAccountDiv_CJ" style="display:none;" mce_style="display:none;"> 6 <tr> 7 <td>借方帐号:</td> 8 </tr> 9 <tr> 10 <td><input type="text" id="borrowAcount" name="borrowAcount" style="200px;" dataType="MoneyRequire" msg="借方帐号不能够为空,且必须为数字!"onclick="this.select()"/><fontcolorfontcolor="#FF0000"> *</font></td> 11 </tr> 12 </div> 13 </table> 14 </body> 15 <head> 16 </head> 17 <body> 18 <table> 19 <div id="borrowAccountDiv_CJ" style="display:none;" mce_style="display:none;"> 20 <tr> 21 <td>借方帐号:</td> 22 </tr> 23 <tr> 24 <td><input type="text" id="borrowAcount" name="borrowAcount" style="200px;" dataType="MoneyRequire" msg="借方帐号不能够为空,且必须为数字!"onclick="this.select()"/><fontcolorfontcolor="#FF0000"> *</font></td> 25 </tr> 26 </div> 27 </table> 28 </body>
那么打开这个html页面后,发现层还是会显示。
后来才发现,其实div和tr的相互嵌套是有问题。所以可以用tbody来代替实现。实现后的代码如下:
Html代码:
1 <head> 2 </head> 3 <body> 4 <table> 5 <tbody id="borrowAccountDiv_CJ" style="display:none;" mce_style="display:none;"> 6 <tr> 7 <td>借方帐号:</td> 8 </tr> 9 <tr> 10 <td><input type="text" id="borrowAcount" name="borrowAcount" style="200px;" dataType="MoneyRequire" msg="借方帐号不能够为空,且必须为数字!"onclick="this.select()"/><fontcolorfontcolor="#FF0000"> *</font></td> 11 </tr> 12 </tbody> 13 </table> 14 </body> 15 <head> 16 </head> 17 <body> 18 <table> 19 <tbody id="borrowAccountDiv_CJ" style="display:none;" mce_style="display:none;"> 20 <tr> 21 <td>借方帐号:</td> 22 </tr> 23 <tr> 24 <td><input type="text" id="borrowAcount" name="borrowAcount" style="200px;" dataType="MoneyRequire" msg="借方帐号不能够为空,且必须为数字!"onclick="this.select()"/><fontcolorfontcolor="#FF0000"> *</font></td> 25 </tr> 26 </tbody> 27 </table> 28 </body>