How can I change and then restore a links content using onClick.

Joe_Bloggs · #1 (**permalink**) 09-22-05, 07:01 AM

Hi,
I am trying to display a link, which when clicked will eventually start an image slideshow, the link contents will change to 'Pause' and when the changed link is clicked again, the original link content 'View slideshow' is restored.
Using the code below, I am able to perform the first content change, but I am struggling to work out how to restore the link back to its original content.
If someone can offer some advice on this then I would be very grateful.

<html>
<head>
<script type="text/JavaScript">
function setLinkContent(link, content)
{
if (document.all)
{
link.innerText = content;
}
else if (document.getElementById)
{
link.firstChild.nodeValue = content;
}
}
</script>
</head>
<body>
<a href="#" onClick="setLinkContent(this, 'Pause');">View Slideshow</a>
</body>
</html>

ben.periton · #2 (**permalink**) 09-22-05, 07:22 AM

How about

<html>
<head>
<script type="text/JavaScript">
function setLinkContent(link, content, previous) {
if (document.all) {
if (link.innerText == content) {
link.innerText = previous;
} else {
link.innerText = content;
}
}
else if (document.getElementById) {
if (link.firstChild.nodeValue == content) {
link.firstChild.nodeValue = previous;
} else {
link.firstChild.nodeValue = content;
}
}
}
</script>
</head>
<body>
<a href="#" onClick="setLinkContent(this, 'Pause', 'View Slideshow');">View Slideshow</a>
</body>
</html>

Joe_Bloggs · #3 (**permalink**) 09-22-05, 08:18 AM

Many thanks Ben, that works great.