2013-05-15 61 views
0

我有多个项目的表。每个条目表行都是一个编辑表行,其中有一个跨越列的单元格,其内部是HTML被动态加载到的DIV。问题是具有所有这些空表格行会导致在页面呈现时出现大量额外的空白。显示/隐藏表行,如果一个孩子DIV为空

我明白我不能动态HTML直接加载到细胞内,所以我有在它一个DIV我内容加载到。

我想隐藏任何表行,而在它的子格是空的,表明表行一旦信息已被动态加载到孩子DIV。这个动态加载的信息也可以删除,所以我需要再次将它隐藏一遍。

<table width="100%"> 
    <tbody> 
    <tr> 
     <td>A</td> 
     <td>B</td> 
     <td>C</td> 
    </tr> 
    <tr style="display: none;"> 
     <td colspan="3"><div></div></td> 
    </tr> 
    </tbody> 
</table> 



$("tr").each(function() { 
    if (this.children().filter(":empty").length) { 
     this.hide(); 
    } else { 
     this.show(); 
    } 
}); 
+5

哪里是你的javascript代码? – Getz

+0

我刚才添加了它 – cianz

回答

2
  • div不是孩子,这是一个孙子,因此children()不会找到div s。改为使用上下文或find

  • 您的DOM元素,而不是jQuery的元素上操作hideshow。你需要首先将它封装在jQuery中。

因此,run this code everytime you load something

//find empty divs and hide it's tr 
$("div:empty").closest('tr').hide(); 

//find non-empty divs and show it's tr 
$("div:not(:empty)").closest('tr').show(); 

再看看马!没有循环!没有each! :d

+1

检查jsfiddle [here](http://jsfiddle.net/satysalokhe/rtgSG/1/)说明约瑟夫jQuery代码 – SatishJS

+0

谢谢,但这只能运行一次吗?当我动态加载到DIV中时,它仍然处于隐藏状态。 – cianz

+0

@cianz更新:) – Joseph

0

您应该使用$(this)代替this

原因是:$(this)是一个jQuery对象,它允许你调用jQuery方法像.children().filter(":empty")就可以了,而this仅仅是一个Javascript对象...