What is triggering window.onBlur ???

Posted on 2007-07-24
Last Modified: 2012-06-27
Hi all,

I have a very elaborate web application that is built on ChatZilla.  I am tapping into the window.onFocus and window.onBlur hooks to accomplish something.  It all works well, except for this strange problem:

In IE 6 only, window.onBlur is not triggered when the window loses focus.  Rather, once the window regains focus, window.onFocus is called immediately followed by window.onBlur (usually the same millisecond, but up to ~20 ms later).

My question is:  any general ideas on tracing back to what is causing this onFocus/onBlur activity?  It has something to do with the application and not the environment, because this does not occur under the same circumstances with a test app, like this:

<script type="text/javascript">

var i = 0;

function prependText(id, text)
    var el = document.getElementById(id);

    el.innerHTML =  "<p>" + ++i + ". " + text + "</p>" + el.innerHTML;

window.onblur =
function window_onblur ()
    prependText("test", "BLUR");

window.onfocus =
function window_onfocus ()
    prependText("test", "FOCUS");

hello world
<span id="test"></span>

Unfortunately the app consists of many files and it's a company proprietary thing, so I can't post much code.  I'm just looking for general suggestions.  It may be helpful to know that there is a small Java applet embedded in the page (can these applets partake in focus?  are they considered a part of the DOM?).  Is it possible that some element in the document is stealing the focus away from the window (it would seem, in this case, that the window would still have focus).

Thanks for the help!
Question by:mistagitar
    LVL 3

    Expert Comment

    This is a strange problem,

    if you look at microsoft documentation on the onblur method:

    You'll see that it doesnt bubbles and you can't cancel it.

    It also says the onblur method will be invoked as soon as you change application or open a second browser window...

    It seems more like the onblur method is called but that the handler is not doing what it is supposed to do.

    If you bypass the code's logic and put an alert() in the onblur method, is it triggered ?

    Author Comment

    I am testing with simple alert() or other output methods, so it isn't the code logic.

    Here's an odd update:

    I now test a flag variable in the onBlur handler to see if it's within 100ms of the last onFocus, and if it is, then to ignore it and call window.focus (thereby leaving the window focused as it should be).  Everything then behaves properly until you click anywhere inside the window, at which time onBlur is called.  Strange huh?  It's almost like the next child of window is taking focus (can document or one of its high children take focus from window?)

    Thanks for the feedback,

    Author Comment

    Well, after a week of digging I couldn't find an elegant solution.  It may have been easier if onBlur and onFocus bubble, but they don't in IE.

    It seems that the elements of the page (table cells, form inputs, etc.) obtain focus when clicked, as they should, but in IE this removes focus from the window object.  Whether or not this should happen is debatable, but here is my workaround:

    window.onblur =
    function window_onblur (e)
        if (!e)
            e = window.event;

        // if the blur was triggered by a click within the dimensions of the window
        // then it was a "false blur" and we re-focus the window (only in IE)
        if (isIE())
            var x = e.clientX;
            var y = e.clientY;
            var w = document.body.clientWidth;
            var h = document.body.clientHeight;

            if (x >= 0 && x <= w && y >= 0 && y <= h)
                return false;

    Hopefully this helps someone.

    LVL 3

    Expert Comment

    Glad you found it out, I was clueless on that point ;)

    LVL 1

    Accepted Solution

    PAQed with points refunded (500)

    EE Admin

    Featured Post

    Looking for New Ways to Advertise?

    Engage with tech pros in our community with native advertising, as a Vendor Expert, and more.

    Join & Write a Comment

    This article shows how to read a single webpage's HTML into a string variable, and it also shows how to automate a sequence so you can read and process a list of webpages.  I was tasked with reading and parsing a series of webpages to collect some s…
    In Part 1 ( we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    746 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    19 Experts available now in Live!

    Get 1:1 Help Now