Preserved Topic: Difference between using href=javascript:... and onClick=....? $Pages that link to <a href="https://ozoneasylum.com/backlink?for=18470" title="Pages that link to Preserved Topic: Difference between using href=javascript:... and onClick=....?" rel="nofollow" >Preserved Topic: Difference between using href=javascript:... and onClick=....?\$

Author	Thread
Pugzly Paranoid (IV) Inmate From: 127.0.0.1 Insane since: Apr 2000	posted 02-07-2002 23:25 Hmmm... I guess I'm wrong... I have a function - function setHome(element){ element.style.behavior='url(#default#homepage)'; element.setHomePage(document.location); } and I call it via <a class="menuItem" href="#" onClick="setHome(this);" all is good. But if I try calling it via <a class="menuItem" href="javascript:setHome(this);" it blows up on me. I was always under the impression you could do either, and I'm reading that XHTML Strict doesn't like onClick statements....
Dracusis Maniac (V) Inmate From: Brisbane, Australia Insane since: Apr 2001	posted 02-08-2002 00:04 You shouldn't be having a problem but I was curious so I decided to test it. It appears that using "this" points to different objects depending on which method your using. Here's my little example: <html><head> <script language="JavaScript"> function myFunction(x) {alert (x.style)} </script></head> <body> <a href="javascript:myFunction(this);">Link 1</a> <br /><br /> <a href="#" onClick="myFunction(this);">Link 2</a> </body></html> I honestly don't know why though. Maybe you could use onMouseDown() instead. Or maybe you shold assign an ID to the anchor and reference it directly rather then using "this".
Slime Lunatic (VI) Mad Scientist From: Massachusetts, USA Insane since: Mar 2000	posted 02-08-2002 00:20 It's because onclick is an event of the A element object. The JavaScript URL is in no way related to the A element. BTW, I'm pretty sure XHTML has no problem with onclick. Just don't capitalize it like "onClick". Oh, also... don't use href="#" !!! two reasons: 1. using href="#" scrolls to the top of the page when the link is clicked. Normally this isn't a problem, but I've seen many instances where it is, and it makes the person who wrote the page look like an idiot for not noticing this annoyance themselves. 2. on some versions of IE, any hash URL makes the browser freeze for a split second. It's an annoyance, especially if you have to keep clicking the link (like on a DHTML scrollbar). Solution: replace "#" with "JavaScript:void(0);"
Pugzly Paranoid (IV) Inmate From: 127.0.0.1 Insane since: Apr 2000	posted 02-08-2002 02:21 Ah - that makes sense (the event part). And actually, I do use javascript:void(0); usually. I just tossed the "#" in there while I was noodling with it. Since this function actually deals with the whole page, and not really the A tag, what would be the correct way to define it? I tried something like <script> function setHome(){ document.style.behavior='url(#default#homepage)'; document.setHomePage(document.location); } </script> <a href="javascript:setHome();">Click me</a> but that's not right. The onclick version does work, I'm just trying to understand things a little better.
Synthetic Paranoid (IV) Inmate From: under your rug, Insane since: Jul 2001	posted 02-08-2002 04:01 Here read this it should be helpfull ( click me ) But I like to use onClick, <a class="chlnk" style="cursor:hand" HREF onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.xtrae.com');">Click here to make Xtrae.com your homepage</a> [This message has been edited by Synthetic (edited 02-08-2002).]
Synthetic Paranoid (IV) Inmate From: under your rug, Insane since: Jul 2001	posted 02-08-2002 05:23 None of those will work on netscape 4 or IE 4 will they? Here is an example of something to try that "should" work in netscape 4+ and IE 4+( Me ) [This message has been edited by Synthetic (edited 02-08-2002).]
Pugzly Paranoid (IV) Inmate From: 127.0.0.1 Insane since: Apr 2000	posted 02-08-2002 05:28 Cool. I've seen that Netscape method before. I'm just trying to keep everything in functions and not in the actual <a>. Thanks!
Hans Obsessive-Compulsive (I) Inmate From: Tampa, FL Insane since: Sep 2002	posted 09-13-2002 22:21 I'm pretty new here (started reading in the last few days) but I came across this thread, and wanted to throw my 2 cents worth in. For the majority of my links (read: 99% of them) I use the following code: a style="cursor:hand" onClick='window.open(http://somesite) other code... I do this for a couple of reasons: 1. It doesn't show the actual link in the status bar (I use other code to put a description there) 2. It doesn't underline the links in the browser, so I can control the text with CSS or manually I never put HREF in the link. Why would you want to? It's not neccessary. The onClick can be a window.open, or a javascript function (I use both.) I haven't had any problem in NN4+ or IE4+ The Amazing Cams!
Slime Lunatic (VI) Mad Scientist From: Massachusetts, USA Insane since: Mar 2000	posted 09-14-2002 00:03 There are two reasons for putting the href in the link: 1. it works for people who use their keyboards and hit "enter" to activate a link, rather than actually clicking on it. 2. the return value of the javascript statement is evaluated as a URL, and the page goes to that URL. And, looking at the original problem now, I see that #2 was the problem. By adding void(0); at the end of the href property, the javascript statement wouldn't have returned anything, so the page wouldn't change. Just putting a function in there ("javascript:myfunc()") will take the return value of the function and act like that was the URL to go to. Sometimes this has weird results.

Preserved Topic: Difference between using href=javascript:... and onClick=....?\$

Author

Thread

Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

posted 02-07-2002 23:25

Hmmm... I guess I'm wrong...

I have a function -
function setHome(element){
element.style.behavior='url(#default#homepage)';
element.setHomePage(document.location);
}

and I call it via
<a class="menuItem" href="#" onClick="setHome(this);"
all is good.

But if I try calling it via
<a class="menuItem" href="javascript:setHome(this);"
it blows up on me. I was always under the impression you could do either, and I'm reading that XHTML Strict doesn't like onClick statements....

Dracusis
Maniac (V) Inmate

From: Brisbane, Australia
Insane since: Apr 2001

posted 02-08-2002 00:04

You shouldn't be having a problem but I was curious so I decided to test it. It appears that using "this" points to different objects depending on which method your using. Here's my little example:

<html><head>
<script language="JavaScript">
function myFunction(x) {alert (x.style)}
</script></head>
<body>
<a href="javascript:myFunction(this);">Link 1</a>
<br /><br />
<a href="#" onClick="myFunction(this);">Link 2</a>
</body></html>

I honestly don't know why though. Maybe you could use onMouseDown() instead. Or maybe you shold assign an ID to the anchor and reference it directly rather then using "this".

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted 02-08-2002 00:20

It's because onclick is an event of the A element object. The JavaScript URL is in no way related to the A element.

BTW, I'm pretty sure XHTML has no problem with onclick. Just don't capitalize it like "onClick".

Oh, also... don't use href="#" !!! two reasons:

1. using href="#" scrolls to the top of the page when the link is clicked. Normally this isn't a problem, but I've seen many instances where it is, and it makes the person who wrote the page look like an idiot for not noticing this annoyance themselves.

2. on some versions of IE, any hash URL makes the browser freeze for a split second. It's an annoyance, especially if you have to keep clicking the link (like on a DHTML scrollbar).

Solution: replace "#" with "JavaScript:void(0);"

Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

posted 02-08-2002 02:21

Ah - that makes sense (the event part).

And actually, I do use javascript:void(0); usually. I just tossed the "#" in there while I was noodling with it. Since this function actually deals with the whole page, and not really the A tag, what would be the correct way to define it?

I tried something like
<script>
function setHome(){
document.style.behavior='url(#default#homepage)';
document.setHomePage(document.location);
}
</script>
<a href="javascript:setHome();">Click me</a>
but that's not right. The onclick version does work, I'm just trying to understand things a little better.

Synthetic
Paranoid (IV) Inmate

From: under your rug,
Insane since: Jul 2001

posted 02-08-2002 04:01

Here read this it should be helpfull ( click me )

But I like to use onClick,

<a class="chlnk" style="cursor:hand" HREF onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.xtrae.com');">Click here to make Xtrae.com your homepage</a>

[This message has been edited by Synthetic (edited 02-08-2002).]

Synthetic
Paranoid (IV) Inmate

From: under your rug,
Insane since: Jul 2001

posted 02-08-2002 05:23

None of those will work on netscape 4 or IE 4 will they?

Here is an example of something to try that "should" work in netscape 4+ and IE 4+( Me )

[This message has been edited by Synthetic (edited 02-08-2002).]

Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

posted 02-08-2002 05:28

Cool. I've seen that Netscape method before. I'm just trying to keep everything in functions and not in the actual <a>.

Thanks!

Hans
Obsessive-Compulsive (I) Inmate

From: Tampa, FL
Insane since: Sep 2002

posted 09-13-2002 22:21

I'm pretty new here (started reading in the last few days) but I came across this thread, and wanted to throw my 2 cents worth in.

For the majority of my links (read: 99% of them) I use the following code:

a style="cursor:hand" onClick='window.open(http://somesite) other code...

I do this for a couple of reasons:

1. It doesn't show the actual link in the status bar (I use other code to put a description there)
2. It doesn't underline the links in the browser, so I can control the text with CSS or manually

I *never* put HREF in the link. Why would you want to? It's not neccessary.

The onClick can be a window.open, or a javascript function (I use both.) I haven't had any problem in NN4+ or IE4+

The Amazing Cams!

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted 09-14-2002 00:03

There are two reasons for putting the href in the link:

1. it works for people who use their keyboards and hit "enter" to activate a link, rather than actually clicking on it.

2. the return value of the javascript statement is evaluated as a URL, and the page goes to that URL.

And, looking at the original problem now, I see that #2 was the problem. By adding void(0); at the end of the href property, the javascript statement wouldn't have returned anything, so the page wouldn't change. Just putting a function in there ("javascript:myfunc()") will take the return value of the function and act like that was the URL to go to. Sometimes this has weird results.