471,594 Members | 2,301 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,594 software developers and data experts.

onmousedown event causing body onload event to fire

Hi,

I am wanting to capture an onmousedown event without firing the body tags
onload event.

Also, if anyone could explain why this happens that would be excellent. I
can't see how an onmousedown event could bubble up to an onload event.

NOTE: If you put an alert() statement in the onmousedown event handler the
body onload event doesn't get fired.

Example code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>test page</title>
</head>

<body onload="alert('loading page');">
<a href="./page.html" onmousedown="this.style.width = '25%';">test
mouse down</a>
</body>
</html>

Jul 20 '05 #1
2 6097
"Bender" <te*******@stickfly.com> writes:
I am wanting to capture an onmousedown event without firing the body tags
onload event.
It never calls the body onload event. The onload event is triggered by
the page being completely loaded. It only happens once, and doesn't
wait for you to click.
Also, if anyone could explain why this happens that would be excellent. I
can't see how an onmousedown event could bubble up to an onload event.
Let me guess: Your example code is saved as the file "page.html"?
In that case, clicking on the a-element will execute the onmousedown event,
and then follow the link and reload the page. That will ofcourse trigger
the onload event on the new page.

To stop the click from following the link, make the onmousedown event
handler return false. That is, add "return false" at the end of the
onmousedown attribute value.
NOTE: If you put an alert() statement in the onmousedown event handler the
body onload event doesn't get fired.
That shouldn't change anything, except maybe make you move the mouse.
Try using the keyboard to get rid of the alert (press return or
escape), and see if it makes a difference.
<a href="./page.html" onmousedown="this.style.width = '25%';">test
mouse down</a>


This test should fail. You try to set the width of an inline element,
which should have no effect at all. The CSS width propert doesn't
apply to inline elements. It will probably work in IE Quirks mode,
but your DOCTYPE should put the browser into standards mode.

Btw, your HTML is not legal. The a-element is an inline element, and
cannot be directly inside the body tag. It needs a paragraph, or
something similar, around it.

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
Jul 20 '05 #2
Lasse Reichstein Nielsen wrote:
"Bender" <te*******@stickfly.com> writes:
<a href="./page.html" onmousedown="this.style.width = '25%';">test
mouse down</a>
[...] The CSS width propert doesn't apply to inline elements.


JFTR: The `width' property does not apply to _non-replaced_
inline elements, table rows and row groups. Unfortunately,
the `a' element is in fact a non-replaced inline element.
Btw, your HTML is not legal.


Surely our robot won't be thrown in prison for that markup,
although one should think about it ;-) The markup is not _valid_.
PointedEars

Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

1 post views Thread by kicksave | last post: by
2 posts views Thread by jva02 | last post: by
1 post views Thread by hal | last post: by
1 post views Thread by Hal | last post: by
reply views Thread by XIAOLAOHU | last post: by
reply views Thread by leo001 | last post: by
reply views Thread by Anwar ali | last post: by

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.