有如下需求，需要控制一个table内几个tr的显示问题。一开始想的方法是在这几个要显示的tr外面套一个div,利用div的display:none属性来解决。 但是后来发现div和tr嵌套的时候会有问题。例如，如果我的html页面是这样的源码：

Html代码：

 <head>

 </head>

 <body>

 <table>

 <div id="borrowAccountDiv_CJ" style="display:none;" mce_style="display:none;">

 <tr>

 <td>借方帐号：</td>

 </tr>

 <tr>

 <td><input type="text" id="borrowAcount" name="borrowAcount" style="width:200px;" dataType="MoneyRequire" msg="借方帐号不能够为空，且必须为数字！"onclick="this.select()"/><fontcolorfontcolor="#FF0000"> *</font></td>

 </tr>

 </div>

 </table>

 </body>

 <head>

 </head>

 <body>

 <table>

 <div id="borrowAccountDiv_CJ" style="display:none;" mce_style="display:none;">

 <tr>

 <td>借方帐号：</td>

 </tr>

 <tr>

 <td><input type="text" id="borrowAcount" name="borrowAcount" style="width:200px;" dataType="MoneyRequire" msg="借方帐号不能够为空，且必须为数字！"onclick="this.select()"/><fontcolorfontcolor="#FF0000"> *</font></td>

 </tr>

 </div>

 </table>

 </body>

那么打开这个html页面后，发现层还是会显示。

后来才发现，其实div和tr的相互嵌套是有问题。所以可以用tbody来代替实现。实现后的代码如下：

Html代码：

 <head>

 </head>

 <body>

 <table>

 <tbody id="borrowAccountDiv_CJ" style="display:none;" mce_style="display:none;">

 <tr>

 <td>借方帐号：</td>

 </tr>

 <tr>

 <td><input type="text" id="borrowAcount" name="borrowAcount" style="width:200px;" dataType="MoneyRequire" msg="借方帐号不能够为空，且必须为数字！"onclick="this.select()"/><fontcolorfontcolor="#FF0000"> *</font></td>

 </tr>

 </tbody>

 </table>

 </body>

 <head>

 </head>

 <body>

 <table>

 <tbody id="borrowAccountDiv_CJ" style="display:none;" mce_style="display:none;">

 <tr>

 <td>借方帐号：</td>

 </tr>

 <tr>

 <td><input type="text" id="borrowAcount" name="borrowAcount" style="width:200px;" dataType="MoneyRequire" msg="借方帐号不能够为空，且必须为数字！"onclick="this.select()"/><fontcolorfontcolor="#FF0000"> *</font></td>

 </tr>

 </tbody>

 </table>

 </body>

转自：http://yafei.iteye.com/blog/743860

用tbody代替div 解决 table tr的隐藏问题的更多相关文章

  1. 解决table插入tr错位

    table中用JavaScript插入隐藏(即display="none";)的tr时,别用display="block";换成display="&q ...

  2. jQuery操作Table tr td常用的方法

    虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...

  3. 汇总常用的jQuery操作Table tr td方法

    虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...

  4. jquery('tr','div')和jquery('tr，div')

     jQuery('tr', 'div') 等价于 $('tr', 'div')    表示div里面寻找tr    jQuery('tr, div') <=> $('tr, div') 表 ...

  5. div模拟table，可实现左右高度同增长（html布局）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. css中table tr:nth-child(even)改变tr背景颜色： IE7,8无效

    例如: .my_table tr:nth-child(even){ background:#E6EDF5; } .my_table tr:nth-child(odd){ background:#F0F ...

  7. DIV中TABLE居的2种方式

    <html><head><title>测试页面</title></head><body><div width=" ...

  8. div模拟table

    <!DOCTYPE html><html><head><meta charset="UTF-8"><title>div模 ...

  9. div 内table 居中实现代码

    有时候在一个div里面添加一个表格,如想让它居住排列,需要做如下的操作. css代码:   代码如下: #dlgReply { /*display: table-cell; text-align: c ...

随机推荐

  1. bzoj1227 [SDOI2009]虔诚的墓主人(组合公式+离散化+线段树)

    1227: [SDOI2009]虔诚的墓主人 Time Limit: 5 Sec  Memory Limit: 259 MBSubmit: 803  Solved: 372[Submit][Statu ...

  2. [Sequence Alignment Methods] Cross-Recurrent Plot (CRP)

    A recurrence plot (RP) is a straightforward way to visualize characteristics of similar system state ...

  3. OpenWrt简要刷机教程

    准备工作 1. 下载openwrt中文固件到PC.(当然其他英文固件也可) 2  找到路由器的RST键. 3  找到路由器刷机口---姑且称之为“WAN口” 4. 关闭路由器的电源. 5. 将PC网口 ...

  4. 深度克隆---js对象引用

    首先,我们要知道,javascript中除了基本类型(number,string,boolean,null,undefined)之外就是引用类型了,也可以说就是js对象了. 引用类型的赋值其实是对象保 ...

  5. POJ1184-------操作分离的BFS

    题目地址:http://poj.org/problem?id=1184 题目意思: 给你两个6位数,一个是起始值,一个最终值 初始光标在最左边 你可以左移或者右移光变 在光标处+1或者-1 在光标处和 ...

  6. Android获取cpu和内存信息、网址的代码

      android获取手机cpu并判断是单核还是多核 /** * Gets the number of cores available in this device, across all proce ...

  7. umlの用例图

    我的总结是在看完uml学习之后又參考了同学借的<uml和ooad高速入门>的思路,利用齿轮带动的原理进行.废话不多说了.首先分析一下类图和用例图的联系与差别. 类图 用例图 类class ...

  8. PHP安全编程：会话数据注入 比会话劫持更强大的攻击(转)

    一个与会话暴露类似的问题是会话注入.此类攻击是基于你的WEB服务器除了对会话存储目录有读取权限外,还有写入权限.因此,存在着编写一段允许其他用户添加,编辑或删除会话的脚本的可能.下例显示了一个允许用户 ...

  9. Android 模仿QQ空间风格的 UI（转）

    本文内容 环境 演示模仿QQ空间风格的UI 虽然这个 UI 跟现在的QQ空间有点差别,但是也能学到很多东西. 下载 Demo 环境 Windows 7 64 位 Eclipse ADT V22.6.2 ...

  10. Java基础知识强化19：Java中switch分支语句

    java中switch语句: 这里expression控制表达式的数据类型只能是byte.short.char.int四种整型类型和枚举类型,不能是boolean类型: Java7(1.7)改进了sw ...