IE9 Window Loses Focus due to jQuery Mobile

Question

In our product, we're using the most recent development version of jQuery Mobile in our ASP.NET website. Each and every time we do an ASP.NET postback, the browser window goes to the back of the screen.

Example:

• Maximize any window. Example: Visual Studio, Word, Windows Explorer.
• Maximize IE9 over it. IE9 is the only thing you see on the screen.
• Click on a button in our solution that does a postback.
• IE9 is no longer visible. Whatever was behind it now has focus (and fills the screen, as it is maximized)

Only workarounds I know:

• Don't include the jQuery mobile scripts.
• Ensure IE9 is the only maximized window in Windows.

I don't know what jQuery Mobile is doing in the background and am assuming this is a bug in IE9 that will eventually be fixed. However, if you had any tips on how to prevent it from happening in the meantime, that would be great.

Edit: Seems it isn't on every postback. It is on every postback that performs a Response.Redirect. I should add that all my postback are actually utilizing ASP.NET AJAX, not full postbacks.

Answer 1

I know this is an old post, but for people coming here from Google:

I ran into this same issue today. It seems this lose focus behavior is what IE does when you trigger the blur event on the window object. This was the code that caused this issue for me:

$(document.activeElement).blur();

activeElement will default to the body element when there are no other elements in focus, and the blur event then bubbles up to the window. To fix this I simply did a check like:

if (document.activeElement != $('body')[0]) {
    $(document.activeElement).blur();
}

Answer 2

I had similar problem with IE10 and jQuery 1.7.2. I found these lines in my code:

$(document.activeElement).blur();

and

$(':focus').blur();

So, adding simple .not('body') resolves the problem:

$(document.activeElement).not('body').blur();
$(':focus').not('body').blur();