473,499 Members | 1,593 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

How to trigger Javascript after link is followed?

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';toggl e('4')"></a>

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

Thanks!

Zachary Glazer

Jul 13 '06 #1
2 2145

zg*****@comcast.net 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';toggl e('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_a rray[loop],
"hidden");}}
function hideDiv(the_div, the_change)
{div_string="document.all."+the_div+".style";the_d iv=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_n ame+".style";disp_div=eval(disp_div_string);disp_d iv.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 '06 #2
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

pe********************@gmail.com 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_a rray[loop],
"hidden");}}
function hideDiv(the_div, the_change)
{div_string="document.all."+the_div+".style";the_d iv=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_n ame+".style";disp_div=eval(disp_div_string);disp_d iv.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 '06 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
8385
by: VK | last post by:
09/30/03 Phil Powell posted his "Radio buttons do not appear checked" question. This question led to a long discussion about the naming rules applying to variables, objects, methods and properties...
6
2521
by: Andy Fish | last post by:
Hi, I want to use an anchor tag to invoke some javascript and I've read that it's bad form to use <a href="javascript:foo()"> I've read endless usenet posts and hint sites on the net, they all...
17
61398
by: Mike Gratee | last post by:
Is it possible to use JavaScript to cause the browser to click a link on a page and have the browser act exactly like the user had clicked on the link directly? In other words, I need to...
2
11351
by: kj | last post by:
How does one trigger an event programmatically? I'm interested in how to do this in both the "Level 0" event model as well as in the DOM Level 2 event model. Thanks! kj -- NOTE: In my...
1
1640
by: livin | last post by:
I use a web page that brings up a table with a series of links that look like this... <a href="javascript:GetAgent('MA142')"> these links open pages that look like this......
136
9198
by: Matt Kruse | last post by:
http://www.JavascriptToolbox.com/bestpractices/ I started writing this up as a guide for some people who were looking for general tips on how to do things the 'right way' with Javascript. Their...
6
4172
by: b. hotting | last post by:
Hi, I don't see why this won't work, it are 3 links, the last one (a get) does work, but the first 2 won't. i would like to use a post, through hidden input types any idea? thanks for your...
7
1837
by: LaughOutLoud | last post by:
Hi. Does anyone knows that how to retrieve variable on a link from javascript. e.g., here I have a link <a href="http://www.domain.com/index.html?id=1111" onClick="getid();">click me</a> <div...
5
1980
by: mesut | last post by:
Hi there, how are you colleagues? I try to set a linkaddress in code behind for a <asp:hyperlinkserver control. but I think I have some syntax problem. I don't know how to fix it. What's...
0
7132
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
7009
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
7178
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
1
6899
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
7390
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
1
4919
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...
0
4602
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
1
665
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
302
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.