根据内容为空隐藏DIV答案

【问题标题】：Hide DIV based on contents being empty根据内容为空隐藏DIV
【发布时间】：2016-03-30 16:39:05
【问题描述】：

我有一个名为 swiper slide 的幻灯片 jquery 插件。我使用幻灯片一次显示来自 PHP mysql 查询的 9 个结果。

目前我的查询代码和幻灯片代码是这样的……

PHP 查询

$query = mysql_query("SELECT * FROM tblClients  
                      WHERE tblclients.package =  
                      'standard' LIMIT 0, 9", $connection); 

$query_page_2 = mysql_query("SELECT * FROM tblClients  
                             WHERE tblclients.package =  
                             'standard' LIMIT 9, 9", $connection);      

$query_page_3 = mysql_query("SELECT * FROM tblClients  
                         WHERE tblclients.package =  
                         'standard' LIMIT 18, 9", $connection);

幻灯片代码

       <div class="swiper-slide">


<?php while ($rows = mysql_fetch_array($query)) { ?>
<div id="main">
<div id="phone"><?php echo $rows['phone']; ?></div>
<img id="client_img" src="<?php echo $rows['client_img']; ?>">
</div>
<?php } ?>     
        </div>




        <div class="swiper-slide">

<?php while ($rows = mysql_fetch_array($query_page_2)) { ?>
<div id="main">
<div id="phone"><?php echo $rows['phone']; ?></div>
<img id="client_img" src="<?php echo $rows['client_img']; ?>">
</div>
<?php } ?>          
        </div>




        <div class="swiper-slide">

<?php while ($rows = mysql_fetch_array($query_page_3)) { ?>
<div id="main">
<div id="phone"><?php echo $rows['phone']; ?></div>
<img id="client_img" src="<?php echo $rows['client_img']; ?>">
</div>
<?php } ?>  

        </div>

我的问题是，无论是使用 jquery 还是 PHP，我如何隐藏空白或内部没有结果的幻灯片。因此，如果我只返回 8 个结果，则应该只显示第一张幻灯片。

【问题讨论】：

您是指单张幻灯片还是滑块？换句话说...
由于某种原因，EMPTY 选择器不起作用，

标签： javascript php jquery mysql css

【解决方案1】：

你可以使用:empty selector

选择所有没有子元素的元素（包括文本节点）。

$(function(){
     $('.swiper-slide:empty').hide()
});

或者，您可以使用简单的 CSS :empty 伪类来实现它

.swiper-slide:empty { display: none;}

【讨论】：

【解决方案2】：

你可以通过它帮助你使用它

$(".swiper-slide:empty:empty").css("display", "none");

【讨论】：

【解决方案3】：

您应该检查查询是否有 0 数据不进入循环像这样的东西包围了所有街区if(mysql_num_rows($query_page_2) > 0) { 你的代码将是

    <?php if(mysql_num_rows($query_page_2) > 0) { ?>
    <div class="swiper-slide">
        <?php while ($rows = mysql_fetch_array($query_page_2)) { ?>
        <div id="main">
        <div id="phone"><?php echo $rows['phone']; ?></div>
        <img id="client_img" src="<?php echo $rows['client_img']; ?>">
        </div>
        <?php } ?>          
    </div>
    <?php } ?>

【讨论】：

【解决方案4】：

只需使用这个 css 属性，你就会得到正确的结果

.swiper-slide img[src=""] {
    display: none;
}

【讨论】：