Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #13248 > unrolled thread

Event Bubbling: Bubble, Bubble, Toil, and Trouble

Back to article view | Back to comp.lang.javascript

Contents

  Event Bubbling: Bubble, Bubble, Toil, and Trouble Gene Wirchenko <genew@ocis.net> - 2012-04-05 15:36 -0700
    Re: Event Bubbling: Bubble, Bubble, Toil, and Trouble "Evertjan." <exjxw.hannivoort@interxnl.net> - 2012-04-05 22:50 +0000
    Re: Event Bubbling: Bubble, Bubble, Toil, and Trouble Matt McDonald <matt@fortybelow.ca> - 2012-04-05 20:57 -0600
      Re: Event Bubbling: Bubble, Bubble, Toil, and Trouble Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-04-06 22:22 +0200

#13248 — Event Bubbling: Bubble, Bubble, Toil, and Trouble

Dear JavaScript'ers:

     I have added onfocus and onblur clauses to my page's <body> tag,
but the events rarely fire.  I have the event code add a line to the
innerHTML of a debug out table element.

     My debug output routine works fine.  The test messages get
written.  The only control that the bubbling messages work on is the
Quit button.  It does not work for any other buttons or any of the
input controls.

     The body tag code looks like:
          <body ... onfocus="DoDebugFocus();" onblur="DoDebugBlur();">

     I also tried adding the clauses to the <form> tag, but that made
no difference.

     What am I missing, please?

Sincerely,

Gene Wirchenko

[toc] | [next] | [standalone]

#13251

Gene Wirchenko wrote on 06 apr 2012 in comp.lang.javascript:

>     I have added onfocus and onblur clauses to my page's <body> tag,
> but the events rarely fire.  I have the event code add a line to the
> innerHTML of a debug out table element.

The body is a strange entity, 
as you will have noticed during puberty.

<body onblur='alert(1)' onfocus='alert(2)'>
will see strange behavour.

Blurring by clicking another window will do as expected,
but clicking the alert after that dismisses the onfocus action.

Blurring by minimising remaximizes the window to show the alert [chrome],
so is a nasty experience for the casual user.

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#13255

On 12-04-05 04:36 PM, Gene Wirchenko wrote:
> I have added onfocus and onblur clauses to my page's<body>  tag,
> but the events rarely fire.  I have the event code add a line to the
> innerHTML of a debug out table element.
>
>       My debug output routine works fine.  The test messages get
> written.  The only control that the bubbling messages work on is the
> Quit button.  It does not work for any other buttons or any of the
> input controls.

Both the `onfocus`[0] and `onblur`[1] events do not bubble in
most environments. I'd advise against relying on that behavior.

However, both the `onfocusin`[2] and `onfocusout`[3] events have
been observed to bubble—though the corresponding MSDN
documentation says otherwise—in Internet Explorer. You may want
to consider those two events. I've provided a test[4]¹ that
confirms my suspicions.

Furthermore, setting the `innerHTML`[5] property in Internet
Explorer on an HTMLTableElement object will err. Doing so is
inadvisable. MSDN has offered up an alternative[6].

You have my apologies if I misinterpreted any portion of your
post. It was a bit vague.

[0]: http://msdn.microsoft.com/en-us/library/ms536934(v=vs.85).aspx
[1]: http://msdn.microsoft.com/en-us/library/ms536909(v=vs.85).aspx
[2]: http://msdn.microsoft.com/en-us/library/ms536935(v=vs.85).aspx
[3]: http://msdn.microsoft.com/en-us/library/ms536936(v=vs.85).aspx
[4]: http://www.fortybelow.ca/Code/JavaScript/Tests/FocusBlur/
[5]: http://msdn.microsoft.com/en-us/library/ms533897(v=vs.85).aspx
[6]: http://msdn.microsoft.com/en-us/library/ms532998(v=vs.85).aspx

¹ Test results as follows:

Linux Mint 12
Opera 11.62—pass;
Firefox 11—fail, no errors;
Chromium 18—fail, no errors.

Windows XP on VirtualBox (via Linux Mint)
Opera 5—fail, no errors;
Opera 6—fail, no errors;
Opera 7—fail, no errors;
Opera 8—fail, no errors;
Opera 9—fail, no errors;
Opera 10—fail, no errors;
Firefox 1—fail, no errors;
Firefox 2—fail, no errors;
Firefox 3—fail, no errors;
Safari 3.1—fail, no errors;
Internet Explorer 6—pass.

-- 
Matt McDonald: Web/Flash Developer; Edmonton, Alberta, Canada

[toc] | [prev] | [next] | [standalone]

#13265

Matt McDonald wrote:

> On 12-04-05 04:36 PM, Gene Wirchenko wrote:
>> I have added onfocus and onblur clauses to my page's<body>  tag,
>> but the events rarely fire.  I have the event code add a line to the
>> innerHTML of a debug out table element.
>>
>>       My debug output routine works fine.  The test messages get
>> written.  The only control that the bubbling messages work on is the
>> Quit button.  It does not work for any other buttons or any of the
>> input controls.
> 
> Both the `onfocus`[0] and `onblur`[1] events do not bubble in
> most environments. I'd advise against relying on that behavior.

For that, please see (and update) 
<https://developer.mozilla.org/en/DOM_Client_Object_Cross-
Reference/DOM_Events>.

> However, both the `onfocusin`[2] and `onfocusout`[3] events have
> been observed to bubble—though the corresponding MSDN
> documentation says otherwise—in Internet Explorer. You may want
> to consider those two events. I've provided a test[4]¹ that
> confirms my suspicions.

However, one should always take the MSDN Library with a handful of salt and 
should not subscribe to Microsoft's proprietary/outdated¹ redefinition of 
what is an event.  The referred names are the names of _event handlers_; the 
corresponding (W3C DOM) event( type)s are `focus' and `blur'.  There is no 
standard equivalent for `onfocusin' and `onfocusout' yet, although there is 
work in progress aiming to standardize them as the event handlers for the 
`focusin' and `focusout' events, respectively.

<http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113>
<http://www.w3.org/TR/2011/WD-DOM-Level-3-Events-20110531> (LC WD)
<http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html> 
(Editor's Draft)


PointedEars
___________
¹  It is curious that even though IE 9 finally supports the W3C DOM event
   model as evident by the support of EventTarget::addEventListener() in
   Standards Mode, the MSDN Library editors have still not managed to fix
   their – at best misleading – terminology.
-- 
> If you get a bunch of authors […] that state the same "best practices"
> in any programming language, then you can bet who is wrong or right...
Not with javascript. Nonsense propagates like wildfire in this field.
  -- Richard Cornford, comp.lang.javascript, 2011-11-14

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web