views:

58

answers:

3

ok heres what i have... it works fine but it looks for a word rather than content. i just want it to show when there is any content..

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

i dont think you need the html for this

it looks for 'Product' how do i make it just look for content >0

thanks!

<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>

its an interspire shopping cart so the %%panel.upc%% calls in something inserted through the admin panel. in this case if there is nothing.. it shows as blank space in the code (viewing source in browser).

+1  A: 

For the updated question: Check the trimmed text of the inner <div>, like this:

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

Previous answer: If you want to show if it has anything, then checking :not() against :empty works:

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

If you want to check for any elements (not possibly whitespace only), then use :has(*), like this:

 if ($("#box3:has(*)").length) {
   $('#third').show();
 }  
Nick Craver
no not working... there is another div inside so maybe it sees that as something? i'll post the html
Alex
@Alex - absolutely it'll see that, if you want to check if something *else* is empty we'll need the HTML.
Nick Craver
@Alex - Updated for your updated question :)
Nick Craver
+1  A: 

If you want to check for text, you can use the text() method:

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

Or for html:

 $(document).ready(function(){
   if ($("#box3").html().length > 0) {
     $('#third').show();
   }                                           
 });
Sarfraz
Checking for `.text()` isn't a good idea here, for example: `<img src="something.jpg" />`
Nick Craver
@Nick Craver: I have also posted the `html()` method, just thought he may only want to check for text not other elements :)
Sarfraz
hmm this is working for me i added a bs id to #box3 div so its looking for the inner box. it still recognized the whitespace so it was showing #third... i just made it "> 5" rather than 0 and it works .... thankyou ! =D
Alex
+1  A: 

You can also check for the HTML's length inside your selector:

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