onclick event wierdness

[hobosalesman]

Consider the following (where 'a' is an anchor element with a valid URL
href):

a.onclick=help_mode;
function help_mode() { alert("hi"); return false; }

As expected clicking on the link now results in a "hi" but no change in
location, the link isn't followed because onclick returned false. Now
look at what I thought was the same thing:

a.addEventListener('click', help_mode, false);
function help_mode() { alert("hi"); return false; }

Clicking on the link now results in "hi" and then the link is loaded!
Can anyone explain what the difference is, that the return value of
false is ignored when addEventListener is used?

I'm trying to disable links for every anchor on the page with
javascript, and instead launch a "help" window based on the title
attribute of the tag. In other words, a help mode where the user can
click on the element they want help with, but I don't want the location
to change when in help mode.

HS

 

[Peter Michaux]

Consider the following (where 'a' is an anchor element with a valid URL
href):

a.onclick=help_mode;
function help_mode() { alert("hi"); return false; }

As expected clicking on the link now results in a "hi" but no change in
location, the link isn't followed because onclick returned false. Now
look at what I thought was the same thing:

a.addEventListener('click', help_mode, false);
function help_mode() { alert("hi"); return false; }

Clicking on the link now results in "hi" and then the link is loaded!
Can anyone explain what the difference is, that the return value of
false is ignored when addEventListener is used?

see stopPropogation() and preventDefault() for DOM 2 events. See
cancelBubble and returnValue for the IE event model.

Note that some versions of Safari, I think all versions less than 2.0,
and some other browsers cannot stop the link being followed if you are
using DOM 2 type handlers. preventDefault doesn't work in these
browsers for at least the onclick event handlers. This was a bug and
the workaround is to use the old style event attributes like your first
try.

Peter

 

[hobosalesman]

see stopPropogation() and preventDefault() for DOM 2 events. See
cancelBubble and returnValue for the IE event model.

Note that some versions of Safari, I think all versions less than 2.0,
and some other browsers cannot stop the link being followed if you are
using DOM 2 type handlers. preventDefault doesn't work in these
browsers for at least the onclick event handlers. This was a bug and
the workaround is to use the old style event attributes like your first
try.

Now I remember why I hate writing javascript. Thanks,

HS

 

[Randy Webb]

(e-mail address removed) said the following on 11/11/2006 10:09 PM:

Now I remember why I hate writing javascript. Thanks,

Javascript is only as difficult as you make it.

 

[Peter Michaux]

Javascript is only as difficult as you make it.

I think an boss or client is completely capable of making it very
difficult for another person.

 

[Randy Webb]

Peter Michaux said the following on 11/11/2006 11:58 PM:

I think an boss or client is completely capable of making it very
difficult for another person.

And I disagree with that. No matter what the requirements from a
boss/client, it doesn't change Javascript itself. It is still the same
language.

 

[hobosalesman]

Javascript is only as difficult as you make it.

It's not difficult at all, it's tedious. Rather, it's not the language
I hate, it's the contradictory implementation among browsers that I
hate. The language itself I'm ambivalent towards.

 

[Jim Ley]

(e-mail address removed) said the following on 11/11/2006 10:09 PM:

Javascript is only as difficult as you make it.

Yep, things like using addEventListener rather than onclick make it
difficult...

Jim.