By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,934 Members | 1,476 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,934 IT Pros & Developers. It's quick & easy.

change text color of a link with onclick event

P: n/a
I created 3 hyperlinks, when the user click each link, it will change
the color of the text of a link. For example, when user clicks Link1,
text Link1 will become red color, but Link2 and Link3 unchange. Here's
my attempts, any ideas??

<script language="javascript">
function changecolor (i)
{
document.i.fontcolor = red;
}
</script></head><a name="item1" href="test.html"
onClick='changecolor(item1)'>Link 1</a><a name="item2"
href="test.html" onclick='changecolor(item2)'>Link 2</a><a
name="item3" href="test.html" onclick='changecolor(item3)'>Link 3</a>
Jul 20 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a
Matt wrote:
I created 3 hyperlinks, when the user click each link, it will change
the color of the text of a link. For example, when user clicks Link1,
text Link1 will become red color, but Link2 and Link3 unchange. Here's
my attempts, any ideas??

<script language="javascript">
function changecolor (i)
{
document.i.fontcolor = red;
}
</script></head><a name="item1" href="test.html"
onClick='changecolor(item1)'>Link 1</a><a name="item2"
href="test.html" onclick='changecolor(item2)'>Link 2</a><a
name="item3" href="test.html" onclick='changecolor(item3)'>Link 3</a>


Hmmmm... Where do I begin...
1. You close the head, but do not create a body
2. I recommend putting the text you want to change in a FONT tag
3. The document.i technique is no good. Use getElementById or all
4. The font color needs to be "red", not red.
....

Well, here is a re-write. It works:

<HTML>
<HEAD>
<script language="javascript">
function changecolor (i)
{
if(document.getElementById)
document.getElementById(i).color = "red";
else if(document.all)
document.all[i].color = "red";

// makes it so the page does not go to test.html
return false;
}
</script>
</head>

<BODY>
<a href="test.html" onClick='return changecolor("item1")'><font
id=item1> Link 1</font></a>
<a href="test.html" onclick='return changecolor("item2")'><font
id=item2> Link 2</font></a>
<a href="test.html" onclick='return changecolor("item3")'><font
id=item3> Link 3</font></a>
</BODY>
</HTML>

Jul 20 '05 #2

P: n/a
Brian Genisio wrote:
2. I recommend putting the text you want to change in a FONT tag


Why? SPAN will do.
--
Bas Cost Budde
http://www.heuveltop.org/BasCB
but the domain is nl

Jul 20 '05 #3

P: n/a
Bas Cost Budde wrote:
Brian Genisio wrote:
2. I recommend putting the text you want to change in a FONT tag

Why? SPAN will do.

Because FONT was the first thing that came to mind, and is most
intuitive. What's wrong with FONT?

Brian

Jul 20 '05 #4

P: n/a
On Thu, 12 Feb 2004 08:28:10 -0500, Brian Genisio <Br**********@yahoo.com>
wrote:
Bas Cost Budde wrote:
Brian Genisio wrote:
2. I recommend putting the text you want to change in a FONT tag


Why? SPAN will do.


Because FONT was the first thing that came to mind, and is most
intuitive. What's wrong with FONT?


It's deprecated and has been for almost the past 7 years, along with
virtually every other presentational feature in HTML[1].

CSS 1 is widely supported and provides most of the functionality that
"presentational HTML" once had. CSS 2, though less supported, provides
more functionality than HTML once had.

Mike
[1] The only ones that remain can be argued to be structural elements that
have a presentational side effect.

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)
Jul 20 '05 #5

P: n/a
Brian Genisio wrote:
Because FONT was the first thing that came to mind, and is most
intuitive. What's wrong with FONT?

<nagging voice> It's deprecated. </nagging voice> Nothing, really.
Although I prefer to use tags to indicate meaning. This sample is
changing font properties, so who's to judge?

BTW could you also use

<a href="test.html" onClick='return changecolor(this)'>

instead of your proposed

<a href="test.html" onClick='return changecolor("item1")'>

?

--
Bas Cost Budde
http://www.heuveltop.org/BasCB
but the domain is nl

Jul 20 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.