473,569 Members | 2,901 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Firefox differences in event handlers through HTML attributes and Javascript DOM

Recently I've rewritten much of my old Javascript code to use DOM functions
so that enhancements can be attached to documents without needing to alter
the HTML code. I assumed that adding event handlers to document.body would
have the same effect as adding those event handlers through attributes of
the body element, but this turned out not to be the case for key events.
Take this example page (IE-specific code removed):

http://www.safalra.com/hotlinkable/key-events.html

Key events will highlight the appropriate table cells in red for a quarter
of a second. It turns out the the DOM equivalent of adding key event
handlers to the body element is to add them to the document object, not
document.body. If the event handler is added to document.body, key events
are only detected for subelements (try typing in the input box).

Is Firefox' behaviour correct, and if so why?

--
Safalra
http://www.safalra.com/programming/javascript/
Mar 24 '07 #1
2 2098
On Sat, 24 Mar 2007 20:04:13 +0000, Safalra wrote:
Recently I've rewritten much of my old Javascript code to use DOM functions
so that enhancements can be attached to documents without needing to alter
the HTML code. I assumed that adding event handlers to document.body would
have the same effect as adding those event handlers through attributes of
the body element, but this turned out not to be the case for key events.
Take this example page (IE-specific code removed):

http://www.safalra.com/hotlinkable/key-events.html

Key events will highlight the appropriate table cells in red for a quarter
of a second. It turns out the the DOM equivalent of adding key event
handlers to the body element is to add them to the document object, not
document.body. If the event handler is added to document.body, key events
are only detected for subelements (try typing in the input box).

Is Firefox' behaviour correct, and if so why?
For the record, Opera behaves in the same way as IE (except it uses the
proper DOM methods to attach events, of course). This is starting to look
more like a bug in Firefox.

--
Safalra
http://www.safalra.com/programming/javascript/
Mar 29 '07 #2
"Safalra" <us****@safalra .comwrote in message
news:1p******** *************** ******@40tude.n et...
On Sat, 24 Mar 2007 20:04:13 +0000, Safalra wrote:
>Recently I've rewritten much of my old Javascript code to use DOM functions
so that enhancements can be attached to documents without needing to alter
the HTML code. I assumed that adding event handlers to document.body would
have the same effect as adding those event handlers through attributes of
the body element, but this turned out not to be the case for key events.
Take this example page (IE-specific code removed):

http://www.safalra.com/hotlinkable/key-events.html

Key events will highlight the appropriate table cells in red for a quarter
of a second. It turns out the the DOM equivalent of adding key event
handlers to the body element is to add them to the document object, not
document.bod y. If the event handler is added to document.body, key events
are only detected for subelements (try typing in the input box).

Is Firefox' behaviour correct, and if so why?

For the record, Opera behaves in the same way as IE (except it uses the
proper DOM methods to attach events, of course). This is starting to look
more like a bug in Firefox.
Firstly, bear in mind I am not JavaScript expert, so if I happen to skip some fundamental
aspect of your theory, feel free to enlighten me.

The document.body event listeners can only be fired within the context of the
document.body. The input (and the table) is part of the document.body, therefore a key
event could only be fired if it could be executed within the context of document.body, for
example, clicking in an input tag within the document.body and firing key events.

document.body.a ddEventListener ('click', function() { alert('within document.body') ; },
false);

Only fires if you click *anywhere* between the top of the page and the input. *Not* below
the input (outside of document.body once you do that).

-Lost
Mar 30 '07 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
2066
by: Fred | last post by:
This seems awkward, isn't there a better way to place event handlers in the rest of the code with the logic for everything else like you can with VBScript? <script language="javascript" if (myvar == true " { do something } lots more code here...
10
3573
by: tony kulik | last post by:
This code works fine in ie and opera but not at all in Mozilla. Anybody got a clue as to how to get it right? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <script language="JavaScript" type="text/javascript"> function show(that) { if (box.style.visibility=='hidden') { that.style.visibility = 'visible'}; }
3
27184
by: Søren M. Olesen | last post by:
Hi In IE there seem to be a global variable window.event, holding the current event....however this dowsn't work in FireFox... is there a similar way to get the current event?? TIA Søren
4
2524
by: Dave H | last post by:
I originally posted a message "Getting the current cursor position using clientX,clientY" in which I hypothesised that the problem I was having was related to event handler execution order. I am now convinced that this is the issue. In the code posted below, I am attempting to demonstrate the problem. If you load the code below into IE...
9
1754
by: chandramohan.mani | last post by:
Does Event handlers work in netscape. If yes means can anyone please help me. <HTML><SCRIPT LANGUAGE="JScript"> function mouseclick() { alert("I was clicked on " + window.event.srcElement.tagName); } </SCRIPT> <BODY onclick="mouseclick()"> <H1>Welcome!</H1>
2
2095
by: jdlwright | last post by:
Hi all, I busted a gut getting my design-mode iframe to work properly in FF1 and IE, and just when I thought everything worked nice I discovered that in FF1.5 event handlers in the iframe are no longer processed; http://developer.mozilla.org/en/docs/Rich-Text_Editing_in_Mozilla they infer that event handlers were never handled, but they...
3
4729
by: yawnmoth | last post by:
I've seen a few webpages that use the javascript pseudo-protocol with event handlers. eg. <input onkeyup="javascript: ..." /> Correct me if I'm wrong, but isn't onkeyup always supposed to be javascript, anyway? As such, isn't usint hte javascript pseudo-protocol redundant? ....or was it required on some archaic browser like Netscape...
2
1206
by: niks | last post by:
Is there a standard way of traversing the DOM to find all the javascript in a document? As far as I know, the only legal positions for javascript in the DOM is within a <scriptelement or in the event handlers of other elements. Are there other legal locations? Finding the <scripttags is easy enough using document.getElementsByTagName. But...
5
2210
by: Ray | last post by:
Hello JavaScript experts, I've been racking my brains for 2 hours and I still haven't figured out this problem. Basically, I have this page (an IE-only page), with a lot of javascript files behind it, most of it not written by me. The problem with this page is: once I use IE6 to load it, moving the mouse pointer over the page will cause...
0
7917
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. ...
0
8118
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
1
7665
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
0
7962
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the...
1
5501
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes...
0
3651
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...
0
3631
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
1207
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
933
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

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.