How to trigger Javascript after link is followed?

Discussion in 'Javascript' started by zglazer@comcast.net, Jul 13, 2006.

  1. Guest

    Hi -- I'm working on a website that uses Javascript and CSS to show or
    hide portions of text on each page. There's a sort of table of contents
    at the top of each page, and rather than using anchor links, my client
    wanted the selected item from the table of contents to trigger both the
    showing of its corresponding text, and the hiding of the text
    corresponding to the other items in the table of contents. I wrote the
    following code to accomplish that (it may be a little bloated; I'm
    relatively new to this):

    function toggle(itemNumber){
    /* THIS FUNCTION IS FOR ALL PAGES EXCEPT THE INDEX.HTML PAGE. IT
    CALCULATES HOW MANY "DL" TAGS EXIST IN THE PAGE, MAKES VISIBLE THE ONE
    THE USER CLICKED ON, AND HIDES ALL THE OTHERS. */
    if (document.getElementsByTagName){
    for (i=1; i<=document.getElementsByTagName("dl").length; i++){
    if (i != itemNumber){
    document.getElementById("item_" + i).style.display = "none"
    }
    else{
    document.getElementById("item_" + itemNumber).style.display =
    "block"
    }
    }
    return false
    }
    else{return true}
    }

    The showing and hiding works fine, as long as you stay on the same
    page, but I'm running into difficulty when I need to let users link
    from one page on the site directly to one of those hidden text blocks
    on another page.

    Is there a way to embed a javascript command in a link, so that it
    executes the command once the link has been followed and the other page
    has loaded? I've tried links on the order of:

    <a href="javascript:location.href='events.html';toggle('4')"></a>

    ....but nothing seems to work. Any hints? If more information is
    needed, please let me know.

    Thanks!

    Zachary Glazer
    , Jul 13, 2006
    #1
    1. Advertising

  2. Guest

    wrote:
    > Hi -- I'm working on a website that uses Javascript and CSS to show or
    > hide portions of text on each page. There's a sort of table of contents
    > at the top of each page, and rather than using anchor links, my client
    > wanted the selected item from the table of contents to trigger both the
    > showing of its corresponding text, and the hiding of the text
    > corresponding to the other items in the table of contents. I wrote the
    > following code to accomplish that (it may be a little bloated; I'm
    > relatively new to this):
    >
    > function toggle(itemNumber){
    > /* THIS FUNCTION IS FOR ALL PAGES EXCEPT THE INDEX.HTML PAGE. IT
    > CALCULATES HOW MANY "DL" TAGS EXIST IN THE PAGE, MAKES VISIBLE THE ONE
    > THE USER CLICKED ON, AND HIDES ALL THE OTHERS. */
    > if (document.getElementsByTagName){
    > for (i=1; i<=document.getElementsByTagName("dl").length; i++){
    > if (i != itemNumber){
    > document.getElementById("item_" + i).style.display = "none"
    > }
    > else{
    > document.getElementById("item_" + itemNumber).style.display =
    > "block"
    > }
    > }
    > return false
    > }
    > else{return true}
    > }
    >
    > The showing and hiding works fine, as long as you stay on the same
    > page, but I'm running into difficulty when I need to let users link
    > from one page on the site directly to one of those hidden text blocks
    > on another page.
    >
    > Is there a way to embed a javascript command in a link, so that it
    > executes the command once the link has been followed and the other page
    > has loaded? I've tried links on the order of:
    >
    > <a href="javascript:location.href='events.html';toggle('4')"></a>
    >
    > ...but nothing seems to work. Any hints? If more information is
    > needed, please let me know.
    >
    > Thanks!
    >
    > Zachary Glazer


    Dear sir,
    You can easily just use divs, and use their property of visibility to
    make them hidden or visible. I used buttons rather than links, but
    both are easily used in a way like this:
    <a href="http://www.somepage.com/"
    onClick="hideDivs();showDiv(div_one);return false;">Div One</a>

    <script type="text/javascript">
    var the_div
    var div_array=new Array("div_one","div_two","div_three","div_four")
    function hideDivs()
    {for(var loop=0;loop<div_array.length;loop++){hideDiv(div_array[loop],
    "hidden");}}
    function hideDiv(the_div, the_change)
    {div_string="document.all."+the_div+".style";the_div=eval(div_string);the_div.visibility=the_change;}
    function showDiv(the_div_name)
    {var disp_div_string;var
    disp_div;disp_div_string="document.all."+the_div_name+".style";disp_div=eval(disp_div_string);disp_div.visibility="visible";}
    </script>

    With a script like this, you will dynamically display each div, which
    can contain HTML content within it, when the client wants it. I'm sure
    someone can make this script much shorter, but this is my version of
    it. Instead of having a table, you can have the actual content of the
    HTML page change with the click of a link, although the link will stay
    there (hopefully). In my case, I mistakenly put a script of this sort
    into a framed page, so the Search Engines will not index it until I get
    it out of frames. I therefore am planning to put it into a table,
    having one row, and two columns. One column for the navigation
    buttons, and the other for the content. I hope that this is what you
    were asking for.

    I have the honor to remain your most humble and Ob't Sv't in our war
    against the King.

    --
    Patrick Reilly
    1st Coy.
    Colonel Seth Warner's Regiment
    , Jul 13, 2006
    #2
    1. Advertising

  3. Guest

    Thanks for your response. I actually ended up figuring out that using
    cookies solves this problem, and it works now! I do appreciate you
    taking the time to answer...

    Thanks again,
    Zachary Glazer

    wrote:

    > Dear sir,
    > You can easily just use divs, and use their property of visibility to
    > make them hidden or visible. I used buttons rather than links, but
    > both are easily used in a way like this:
    > <a href="http://www.somepage.com/"
    > onClick="hideDivs();showDiv(div_one);return false;">Div One</a>
    >
    > <script type="text/javascript">
    > var the_div
    > var div_array=new Array("div_one","div_two","div_three","div_four")
    > function hideDivs()
    > {for(var loop=0;loop<div_array.length;loop++){hideDiv(div_array[loop],
    > "hidden");}}
    > function hideDiv(the_div, the_change)
    > {div_string="document.all."+the_div+".style";the_div=eval(div_string);the_div.visibility=the_change;}
    > function showDiv(the_div_name)
    > {var disp_div_string;var
    > disp_div;disp_div_string="document.all."+the_div_name+".style";disp_div=eval(disp_div_string);disp_div.visibility="visible";}
    > </script>
    >
    > With a script like this, you will dynamically display each div, which
    > can contain HTML content within it, when the client wants it. I'm sure
    > someone can make this script much shorter, but this is my version of
    > it. Instead of having a table, you can have the actual content of the
    > HTML page change with the click of a link, although the link will stay
    > there (hopefully). In my case, I mistakenly put a script of this sort
    > into a framed page, so the Search Engines will not index it until I get
    > it out of frames. I therefore am planning to put it into a table,
    > having one row, and two columns. One column for the navigation
    > buttons, and the other for the content. I hope that this is what you
    > were asking for.
    >
    > I have the honor to remain your most humble and Ob't Sv't in our war
    > against the King.
    >
    > --
    > Patrick Reilly
    > 1st Coy.
    > Colonel Seth Warner's Regiment
    , Jul 24, 2006
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Brent
    Replies:
    1
    Views:
    1,446
  2. =?Utf-8?B?QW5kcmU=?=

    Stylesheets are not followed after migration

    =?Utf-8?B?QW5kcmU=?=, Mar 30, 2006, in forum: ASP .Net
    Replies:
    6
    Views:
    369
    Gerry Hickman
    Apr 13, 2006
  3. Replies:
    1
    Views:
    353
    Roedy Green
    Aug 12, 2005
  4. =?Utf-8?B?TWFlIExpbQ==?=

    Urgent: Trigger javascript function after bind control

    =?Utf-8?B?TWFlIExpbQ==?=, Jun 7, 2006, in forum: ASP .Net
    Replies:
    3
    Views:
    531
    Bill Gregg
    Jun 7, 2006
  5. Da Costa Gomez

    Link activation followed by popup

    Da Costa Gomez, Jul 13, 2003, in forum: Javascript
    Replies:
    0
    Views:
    91
    Da Costa Gomez
    Jul 13, 2003
Loading...

Share This Page