如果单元格为空，则隐藏单元格顶部边框答案

【问题标题】：hide cell top border if the cells are empty如果单元格为空，则隐藏单元格顶部边框
【发布时间】：2012-01-10 16:16:13
【问题描述】：

有一个包含两行的 OfficeInfo 表，每行有两个单元格。底部第二行的每个单元格都有顶部边框点缀，以奇特的方式将顶部和底部行分开。如果左下单元格为空，我需要能够隐藏左边框，如果右下单元格为空，我需要隐藏右边框。这样，如果没有内容，就不会有边框挂在那里没有理由..你是如何使用 jquery 做到这一点的？？

<table class="OfficeInfo" border="0" style="width: 100%" cellspacing="10px" cellpadding="15px">
  <tr>
    <td class="Office1" style="width=40%">  
     <span class="OfficeName">
     Munster Women&#39;s Center<br />
     </span>
     <span class="Address">
     8075 North Shadeland Avenue,  <br />Indianapolis, IN 46250         
     </span> 
     <span class="Phone">
     (321) 223-1232</span><br />
     <a class="mapdirectionsLink" href="#">map &#38; directions&#62;</a><br /><br />
     <span class="Hours">
     MTW: 9:00 AM- 5:00 PM</span>
    </td>

    <td class="Office2" style="width:40%">  
    </td>
  </tr>                                       
  <tr>                                    
    <td class="Office3" style="border-top:1px dotted silver;  width:40%;">   
    </td>
    <td class="Office4" style="border-top:1px dotted silver;  width:40%">                           
    </td>
  </tr> 
 </table>

【问题讨论】：

标签： jquery hide border cell

【解决方案1】：

您可以使用 jquery :empty 选择器来定位空的 TD 并更改边框 CSS 属性。假设前两个单元格永远不会为空，您可以执行类似的操作

 $('table.OfficeInfo td:empty').css('border', '0px');

【讨论】：

【解决方案2】：

你可以试试这个代码

  $('table.OfficeInfo tr:last > td').each(function(){ 
        if($.trim($(this).html()) == ""){
             $(this).css('border', '0px')
        }
  });

希望对你有帮助

谢谢。

【讨论】：