CODEWITHSUNDEEP
javascriptjqueryurlhtml
Matt Stone
Matt Stone

Reputation: 11

Hide a div based on the URL

I am trying to hide a div whenever someone goes to a specific url.

Something like this:

var url = document.location.href;

if (url.indexOf('http://donorperfect.local/asp/loginfull.asp') >= 0) {
    $('#hidebox').hide();
} else {
    $('#hidebox').show();
}

write("<div id=\"hidebox\">\n");
write("<p>test</p>\n");
write("</div>\n");

Upvotes: 0

Views: 4709

Answers (4)

user2245867
user2245867

Reputation:

This will help you!!! Try this. it grabs the URL from the address bar.

var url = window.location.href;
if(url == "http://www.promilitarybusinessnetwork.com/continueSearch.asp?categoryID=108") {
    $('#website').html('<p>This is the Apartments Category page</p>');
} else {
    $('#website').hide();
}});

if not .hide();. try .empty();

Upvotes: 0

Jared Farrish
Jared Farrish

Reputation: 49188

EDIT

Going off of the link that you provided as an example, there are several issues here.

  1. Your SCRIPT tag should be in the HEAD block
  2. You are using $() when it is not available (Firebug gives a clear error on this)
  3. The file name does not match your indexOf() match

Fixing these issues, it works fine. See:

<head>
...
<script language='JavaScript' src='/js/jquery-1.4.1.js' type="text/javascript"></script>
...
<script type="text/javascript">
$(function(){
    var url = window.location.href; 

    if (url.indexOf('donorperfect.html') > -1) { 
        $('#hidebox').show();
    } else { 
        $('#hidebox').hide();  
    } 
});
</script>
...
</head>

http://jfcoder.com/test/donorperfect.html

The following code works (setTimeout is for demonstration purposes):

document.write("<div id=\"hidebox\">\n");
document.write("<p>test</p>\n");
document.write("</div>\n");

$(document).ready(function(){
    var url = 'http://donorperfect.local/asp/loginfull.asp';

    if (url.indexOf('http://donorperfect.local/asp/loginfull.asp') > -1) {
        setTimeout(function(){$('#hidebox').hide()},2000);
    } else {
        $('#hidebox').show();
    }
});

http://jsfiddle.net/userdude/Qt8uH/

Although this is probably what I would recommend (for instance, what happens if it's HTTPS?):

document.write("<div id=\"hidebox\">\n");
document.write("<p>test</p>\n");
document.write("</div>\n");

$(document).ready(function(){
    var url = 'http://donorperfect.local/asp/loginfull.asp';

    if (url.toLowerCase().indexOf('loginfull.asp') > -1) {
        setTimeout(function(){$('#hidebox').hide()},2000);
    } else {
        $('#hidebox').show();
    }
});

http://jsfiddle.net/userdude/Qt8uH/1/

Upvotes: 2

Obi
Obi

Reputation: 49

You can try changing document.location.href to window.location.pathname;

So your code now says

var url = window.location.pathname; 

    if (url.indexOf('http://donorperfect.local/asp/loginfull.asp') >= 0) { 
     $('#hidebox').hide(); 
     } else { 
     $('#hidebox').show(); 
     }

Upvotes: 0

ShankarSangoli
ShankarSangoli

Reputation: 69905

Run your code after the page is loaded and the element to hide is available to jQuery. Also convert the url into lower case and compare in case user types in mixed cases.

$(function(){
     var url = document.location.href;

     if (url.toLowerCase().indexOf('http://donorperfect.local/asp/loginfull.asp') >= 0) {
       $('#hidebox').hide();
     } else {
        $('#hidebox').show();
     }
});

Upvotes: 2

Related Questions