...

View Full Version : Resolved Displaying HTML Code Only on Specific Pages



Zbot
09-09-2011, 09:31 PM
Basically what I need to do is cause a bit of HTML to only display on a specific page. I have figured out how to do most of the work i.e. figuring out what page that the code is being displayed on, etc. However, for some reason the DOM element that I am using will not update based on the Javascript. I have searched the Internet for a solution and unfortunately I have found none.
Here is the version of the code that I am currently working on:


<html>
<head>
<script type="text/javascript">
window.onload = function DisplayButton() {
var DesiredPage = 'Page to Display';
//Page that I want the code to display on
var sPath = window.location.pathname;
var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
//This determines and places in a variable what page that the code will be on
if (sPage == DesiredPage) {
document.getElementById('HiddenCode').style.display = "block";
}
}
</script>
<p Id="HiddenCode" style="display:none">Code only to be displayed on indicated page</p>
</head>
</html>

I am somewhat new to Javascript so I feel like I might be missing something obvious here.

Thank You to anyone who can help.
Zbot

Old Pedant
09-09-2011, 09:36 PM
So have you debugged??

Even if you don't know how to use a debugger (and you should...you should install and use FireBug with Firefox), you can add in a little debug code:



window.onload = function DisplayButton() {
var DesiredPage = 'Page to Display';
//Page that I want the code to display on
var sPath = window.location.pathname;
var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
alert( "DesiredPage=" + DesiredPage + "\nsPage=" + sPage);
//This determines and places in a variable what page that the code will be on
if (sPage == DesiredPage) {
document.getElementById('HiddenCode').style.display = "block";
}
}

Rowsdower!
09-09-2011, 09:41 PM
For a test, add the highlighted code to your page and run a test again:


window.onload = function DisplayButton() {
var DesiredPage = 'Page to Display';
//Page that I want the code to display on
var sPath = window.location.pathname;
var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
//This determines and places in a variable what page that the code will be on
if (sPage == DesiredPage) {
if(document.getElementById('HiddenCode')){
alert('You\'re good to go!');
document.getElementById('HiddenCode').style.display = "block";
}
else{
alert('The page hasn\'t really finished loading yet but the window.onload event fired anyway...');
}
}
}

Zbot
09-09-2011, 09:42 PM
Yes, I have debugged. However, even when the two values are not equal the "Code only to be displayed on indicated page still shows up. That is the problem.

Old Pedant
09-09-2011, 09:47 PM
Oh, doh on me!

You are *CREATING* the function when you load the window, but you *NEVER* call it!!!!

Simplest fix:


<script>
function DisplayButton() {
var DesiredPage = 'Page to Display';
//Page that I want the code to display on
var sPath = window.location.pathname;
var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
//This determines and places in a variable what page that the code will be on
if (sPage == DesiredPage) {
document.getElementById('HiddenCode').style.display = "block";
}
}
window.onload = DisplayButton;
</script>


Other ways to do this, but this is simplest.

Zbot
09-09-2011, 11:52 PM
Rowsdower!: The test you gave me told me that my issue lies within I would assume that the window.onload is firing before the page fully loads. How might I fix that issue?

Old Pendant: Yeah now i realize that it was not loading the function, derp. However, even when I do call the function it does not function as intended. I.E. it will still display the code when it is on the "wrong" page. I think that it might have something to do with what Rowsdoer! said. However, I am not sure exactly how to fix that.

Old Pedant
09-10-2011, 02:32 AM
http://www.mywhizbang.com/ShowMe1.html

Go ahead. Look at it.

Click on your VIEW menu. Click on your SOURCE (or PAGE SOURCE) menu item.

Then click on the "Go to other page" link.

Well?

Enough said?

I have no idea what you are doing wrong in your actual code. But the code as given works perfectly.

Zbot
09-10-2011, 05:20 PM
Thanks Old Pendant, I don't know what you did, but it works now great, appreciate the help, I'll change the topic to resolved if I can.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum