Travis
Travis

Reputation: 161

Perform function if body id is a specific value

I'd like to perform a function on only one page of my site where the body has an ID of #modulePage16460412. I have the script below that is not working.

<script type="text/javascript">
if($('#modulePage16460412').length > 0 ) {
$(function()
{
$(window).bind('load',
    function(e)
    {
    window.setTimeout(function()
        {
         $.colorbox({opacity:0.3, href:"/storage/support/colorbox/offer.html"});
        }, /*timeout->*/ 2000);
    });
});
}
</script>

Would it also be possible to only execute the function the first time they visit the page and not execute again if they come back to that page?

Any help would be appreciated.

Upvotes: 0

Views: 1077

Answers (4)

rlemon
rlemon

Reputation: 17666

You can just put the function on the body load selecting it with the ID specified... if no element exists with this ID then the function will never fire.

$('#modulePage16460412').load(function() { // this will not be called unless an element with that ID has loaded into the DOM

     // ... your code here.

});

and to touch on the 'single execution' part (this really should be a new question... but ohh well) you can use localStorage to persist the setting.

http://jsfiddle.net/rlemon/ET9Zg/

in your case something like

if( !getData('someKey') ) {
   // ok so they have not been here.
   setData('someKey', 1); //  now set the data so this won't get hit again.
} 

Upvotes: 1

dqhendricks
dqhendricks

Reputation: 19251

Perhaps a simpler approach?

$( document ).ready( function() { // runs code only after DOM ready
   if ( $( '#modulePage16460412' ).length > 0 ) { // runs code only if id found
       window.setTimeout( function() {
          $.colorbox( { opacity:0.3, href:"/storage/support/colorbox/offer.html" } );
       }, 2000 );
   }
} );

Upvotes: 0

Shreedhar
Shreedhar

Reputation: 5640

your defining a function, but not calling anywhere.

so put everything inside some function and call.

and also replace this if($('#modulePage16460412').length > 0 ) with if($('#modulePage16460412')), because when jquery couldnt find element with id : #modulePage16460412, it will return empty array. empty_array.length = 0, so it will always be true.

$('document').ready(function(){

if($('#modulePage16460412')) {
$(function()
{
$(window).bind('load',
    function(e)
    {
    window.setTimeout(function()
        {
         $.colorbox({opacity:0.3, href:"/storage/support/colorbox/offer.html"});
        }, /*timeout->*/ 2000);
    });
});
}

});

Upvotes: 0

wanovak
wanovak

Reputation: 6127

You need to put the condition inside $(function(){ so that the body tag is actually loaded before the JavaScript queries the (unloaded) DOM for the existence of the ID.

$(function(){
    if($('#modulePage16460412').length) {

        ...

    }
});

Upvotes: 0

Related Questions