Can't trigger javascript from seperate page.

Beginner question.   I have 2 pages.  When I click on page 2 I want it to load page 1 AND execute javascript on the first page.  

The solution I tried is to use a hash (see code below:  Page 1 is 'puppies'.  Page 2 is 'index.html')

There is a live example running that demonstrates this problem:  

Go to http://107.22.173.10 then click Item 1.    This is the result "I like puppies" is I want to see when I click the hashed index.html
Then click "puppies" and click Item 1 from that page.   It should produce the same result but it doesn't

Link to the Page  http://107.22.173.10
Link to the trigger I can't get working:  http://107.22.173.10/index.html#runFunction1

I know very basic javascript and I need some expert help debugging this.  Any ideas what is happening here?   How can I achieve the functionality I want?
Page 1 Code:
<a href="index.html#runFunction1">Item 1: triggers index.html#runFunction1</a>

Page 2 Code:
 function showItem1() {
         $("txtCtr").update("<h2>Item 1</h2> <p>I like puppies.</p>");
      }
        
      if (window.location.hash == '#runFunction1') {
          showItem1();
      }

Open in new window

tmonteitAsked:
Who is Participating?
 
nap0leonCommented:
When I click on page 2 I want it to load page 1 AND execute javascript on the first page.

I may have your pages mixed up... but if this is your scenario::

1- You click a link on a page that takes the user to a different page
2- you want a javascript function on the new page to run

Then you do it like this:
1- the link you click on page2 - use window.location.href="page1.html?showItem=runFunxtion1"
2- in the window.onload of page1.html, read the URL and based on the value of the parameter, run the function.

Here is a handy function for reading parameters from the querystring.  If you insist on using the hash, I'm sure there are similar out there or one can be created for you.  You use it like this
if (queryString('showItem')=='runFunction1') {
  //run function 1
}

Open in new window


Here is the function.
function queryString(parameter) { 
    var loc = location.search.substring(1, location.search.length);
    var param_value = false;

    var params = loc.split("&");
    for (i=0; i<params.length;i++) {
        param_name = params[i].substring(0,params[i].indexOf('='));
        if (param_name == parameter) {
            param_value = params[i].substring(params[i].indexOf('=')+1)
        }
    }
    if (param_value) {
        return param_value;
    }
    else {
        return false; //Here determine return if no parameter is found
    }
}

Open in new window

0
 
COBOLdinosaurCommented:
You can't use a link to target a function on another page.


Cd&
0
 
tmonteitAuthor Commented:
The trigger worked perfect!  Thanks a bunch.  Unfortunately the code failed for another reason.  I will ask a separate question.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.