Masquer div dans jQuery si une case est vide

Question

J'ai créé une boîte rouge en utilisant div qui est vide à l'intérieur de la boîte, avec un lien en dehors de la boîte rouge div ... comme ça.

<div id="click"> click me </div> 

<div id="box"></div> 

Et j'ai ajouté du code PHP à l'intérieur de la boîte rouge, ce qu'il fait est lorsque le fichier est ouvert, il ne montre le bouton avec le nom de fichier à l'intérieur de la boîte rouge. Ce que j'essaie de faire est que lors du chargement de la page, si la boîte rouge est vide (pas de bouton à l'intérieur de la boîte rouge) alors cachez-la automatiquement, si elle n'est pas vide, affichez la boîte rouge avec les boutons.

J'ai aussi un autre bouton qui me permet d'avoir à bascule glisser pour la boîte rouge, peu importe si elle est vide ou non.

voir le code

$(document).ready(function() { 
    if ($('#box').contents().length == 0){ 
    $('#box').hide(); 
} else { 
    $('#box').show(); 
} 
}); 

$(document).ready(function(){ 
    $("#click").click(function(){ 
     $("#box").slideToggle("slow"); 
    }); 
}); 

J'ai essayé avec en CSSlike ce ...

$("div:empty").hide(); 
div:empty { display: none } 

et jQuery comme

$('div').filter(function() {  
    return $.trim($(this).text()) === ''  
}).remove() 

Aucune de ces div à cause de travail boîte rouge est également impliqué dans un espace vide même s'il s'agit d'une boîte vide, ou affiche du code PHP à l'intérieur de la boîte et considère encore pour cs s ou jquery, pas une boîte vide.

Comment puis-je résoudre ce problème de masquage automatique si une case est vide?

Voir le code exemple dans jsfiddle

Answer 1

Vous pouvez tirer juste le texte de la zone et si elle ne contient que l'espace blanc, une fois que vous verrez la découper comme vide. Exemple:

$(document).ready(function() { 
    if ($('#box').text().trim().length == 0){ 
     $('#box').hide(); 
    } else { 
     $('#box').show(); 
    } 
}); 

et une mise à jour de votre violon travail https://jsfiddle.net/t1oum9xe/