如何在 php/html 中隐藏整个空列

Posted 2023-02-24

【中文标题】如何在 php/html 中隐藏整个空列

【英文标题】：How to hide the whole empty columns in php/html

【发布时间】：2014-10-19 15:56:36

【问题描述】：

只是想隐藏我表中的整个空列。

表格代码如下：

   <table  border="1" cellspacing="2" cellpadding="2" id="weatherTable">

 <tr>
<th align="center" valign="bottom" bgcolor="#CCCCCC"><strong>DISPLAYED REPORTS AVERAGES:</strong></th>
<td align="center" valign=bottom><font size="4"><b><strong>--</strong></b></font></td>
<td align="center" valign=bottom><font size="4"><b><?php echo $row["air_temp"]; ?></b></font></td>
<td align="center" valign=bottom><font size="4"><?php echo $row["sea_temp"]; ?></font></td>
</tr>

 <tr>
<th align="center" valign="bottom" bgcolor="#CCCCCC"><strong>Station (ID)</strong></td>
<th align="center" valign="bottom" bgcolor="#CCCCCC"><strong>Time<br>(UTC)</strong></td>
<th align="center" valign="bottom" bgcolor="#CCCCCC"><strong>Air Temp<br>(&deg;C)</strong></td>
<th align="center" valign="bottom" bgcolor="#CCCCCC"><strong>Sea Temp<br>(&deg;C)</strong></td>
 </tr>

 <tr>

 if (($sth-> rowCount())>0) 

foreach (($sth->fetchAll(PDO::FETCH_ASSOC)) as $col) 
?>

<tr>
<td align="right" valign=top><?php echo $col["name"] . " (" . $col["dim_stationID"] . ")"; ?></td>
<td align="center" valign=top><?php $d = $col["date_time"]; $t = explode(" ",$d); $s = explode (":",$t[1]); echo "".$s[0]."".$s[1].""; ?> </td>
<td align="center" valign=top><?php echo $col["air_temp"]; ?></td>
<td align="center" valign=top><?php echo $col["sea_temp"]; ?></td>
</tr>

数据填充在这 4 列中，每个报告每行，我已经在表格顶部为每一列设置了平均值，所以现在最后一列“Sea Temp”是空的，我怎么能隐藏整列？

PS：我在编码

 $('td:empty').each(function(i)
 $(this).hide().parents('weatherTable').find('th:nth-child('+(i+1)+')').hide();
 );

但是该代码隐藏了每个空字段（不想要），例如在“Air Temp”列下有三行不同的报告，并且有一行包含该列中的数据，另外两行是空的。从逻辑上讲，由于整列不为空，因此该列不应隐藏。

【问题讨论】：

您可以查看：***.com/questions/9003335/…

  将<td> 留空有什么问题？

检查this answer here

【参考方案1】：

正如Hiding a table column if the containing cells are empty with jQuery 中的回答（由 maclema 回答），您可以使用以下内容：

var numCols = $("th", table).length;
for ( var i=1; i<=numCols; i++ ) 
    var empty = true;
    //grab all the <td>'s of the column at i
    $("td:nth-child(" + i + ")", table).each(function(index) 
        //check if the td is not empty
        if ( $(this).text() != "" ) 
            empty = false;
            return false; //break out of each() early
        
    );
    if ( empty ) 
        $("td:nth-child(" + i + ")", table).hide(); //hide <td>'s
        $("th:nth-child(" + i + ")", table).hide(); //hide header <th>
    

【讨论】：

我写的是完全一样的逻辑，很棒的方法lpg

【参考方案2】：

试试这个，你就完成了

function hideEmptyCols(table) 
    var rows = $("tr", table).length-1;
    var numCols = $("th", table).length;
    for ( var i=1; i<=numCols; i++ ) 
        if ( $("span:empty", $("td:nth-child(" + i + ")", table)).length == rows ) 
            $("td:nth-child(" + i + ")", table).hide();
            $("th:nth-child(" + i + ")", table).hide();        
    

【讨论】：

@KevinF。那是很久以前的帖子，我没有搜索只是回复了问题