web-dev-qa-db-fra.com

si div a un contenu show div

ok heres ce que j'ai ... ça marche bien mais ça cherche un mot plutôt que du contenu. Je veux juste que ça se passe quand il y a du contenu ..

 $(document).ready(function(){
       if ($("#box3:contains('Product')").length) {
          $('#third').show();
       }                                           
    });

je ne pense pas que vous ayez besoin du HTML pour cela 

il cherche 'produit' comment puis-je le faire juste chercher du contenu> 0

<div id="first" class="tab" >
    <div class="tabtxt">
        <a>DETAILS</a>
    </div>
</div>
<div class="tab" id="second">
    <div class="tabtxt">
        <a>INSPIRATION</a>
    </div>
</div>
<div class="tab" id="third" style="display:none">
    <div class="tabtxt">
        <a>NOTES</a>
    </div>
</div>

<div class="boxholder">
    <div style="overflow: hidden; display:block" class="box" id="box1">
        <div style="padding: 10px; line-height:16px">
            %%Panel.ProductDescription%%
        </div>
    </div>
    <div style="overflow: hidden; display:none" class="box" id="box2">
        <div style="padding: 10px; line-height:16px">
            %%Panel.ProductWarranty%%
        </div>
    </div>
    <div style="overflow: hidden; display:none" class="box" id="box3">
        <div style="padding: 10px; line-height:16px">
            %%Panel.UPC%%
        </div>
    </div>
</div>

c'est un panier d'achat interspire de sorte que %% panel.upc %% appelle quelque chose inséré via le panneau d'administration. dans ce cas, s'il n'y a rien .. il est indiqué comme un espace vide dans le code (affichage de la source dans le navigateur).

jqueryanimationhtml
34
Alex

Si vous voulez vérifier text, vous pouvez utiliser la méthode text():

 $(document).ready(function(){
   if ($("#box3").text().length > 0) {
     $('#third').show();
   }                                           
 });

Ou pour le HTML:

 $(document).ready(function(){
   if ($("#box3").html().length > 0) {
     $('#third').show();
   }                                           
 });
61
Sarfraz

Pour la question mise à jour: Vérifiez le texte coupé du <div> intérieur, comme ceci:

 if ($.trim($("#box3 div").html())) {
   $('#third').show();
 }

Réponse précédente: Si vous voulez montrer s'il a rien, alors vérifier :not() contre :empty fonctionne:

 if ($("#box3:not(:empty)").length) {
   $('#third').show();
 }

Si vous voulez rechercher des éléments (pas nécessairement des espaces uniquement), utilisez alors :has(*) , comme ceci:

 if ($("#box3:has(*)").length) {
   $('#third').show();
 }
14
Nick Craver

Vous pouvez également utiliser le sélecteur CSS3 :empty

div#empty-div:empty {
   display: none;
}

Le sélecteur :empty ne cible que les éléments vides, sans espace.

0
KKumar

Vous pouvez également vérifier la longueur du code HTML dans votre sélecteur:

if ($("#box3").html().length) {
    $('#third').show();
}
0
swilliams