Question

我有一個名爲swiper slide的幻燈片jquery插件。我使用幻燈片一次顯示來自PHP mysql查詢9結果的結果。

目前我的查詢代碼和幻燈片的代碼看起來像這樣...

PHP QUERY

$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); 

SLIDE CODE

 <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個結果，則第1張幻燈片應該是唯一顯示的結果。

Answer 1

，你應該檢查是否有查詢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 } ?> 

Answer 2

您可以使用:empty selector

選擇有沒有孩子（包括文本節點）的所有元素。

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

或者，您可以使用簡單的CSS :empty僞類

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

Answer 3

實現它，你可以用它通過可它幫助你

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

Answer 4

只需用這個CSS財產你將得到正確的結果

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