如果为空则隐藏表行

时间:2012-10-04 16:35:38

标签: html css jsp

我的JSP中有一个表,当生成页面时它可以为空,我想知道是否有一种方法让我隐藏它们只有在它们没有实际文本的情况下,这就是它们的外观等。

<TABLE border="1" style="empty-cells:hide;padding-left:4px">
<TR>
    <TD><s:property value="barfoo"/></TD>
    <TD align="center"><s:property value="foo"/></TD>
    <TD align="center"><s:property value="bar"/></TD>
    <TD align="center"><s:property value="foobar"/></TD>
</TR>
<TR>
    <TD><s:property value="barfoo"/></TD>
    <TD align="center"><s:property value="foo"/></TD>
    <TD align="center"><s:property value="bar"/></TD>
    <TD align="center"><s:property value="foobar"/></TD>
</TR>
<TR>
    <TD><s:property value="barfoo"/></TD>
    <TD align="center"><s:property value="foo"/></TD>
    <TD align="center"><s:property value="bar"/></TD>
    <TD align="center"><s:property value="foobar"/></TD>
</TR>
<TR>
    <TD><s:property value="barfoo"/></TD>
    <TD align="center"><s:property value="foo"/></TD>
    <TD align="center"><s:property value="bar"/></TD>
    <TD align="center"><s:property value="foobar"/></TD>
</TR>
</TABLE>

但事情不是所有的东西都会被填满,有时它们基本上会返回空值而只留下一个空的空间,我想隐藏它们只有当它们要离开那个空的空间时我可以使用一个适用于大多数浏览器的简单解决方案来隐藏那个空白区域吗?

3 个答案:

答案 0 :(得分:9)

您可以使用css :empty pseudo-class

tagname:empty {
 display: none;
}

pseudo-class个样式为空元素...

在你使用它之前一定要确保它没有被广泛支持,很可能IE会引起问题

答案 1 :(得分:0)

我认为您可以使用CSS属性空单元格来执行此操作,如下所示:

table {
  empty-cells:hide;
}

答案 2 :(得分:0)

使用s:property表示您使用的是Struts。在这种情况下,您可以使用s:if标记围绕您的表格,以检查是否有数据来呈现该表格。