Geek Answers Handbook

SetTimeout - strange behavior

Consider the following HTML:

<html> <head></head> <body> <input type="text" onblur="window.setTimeout('document.title += 2;', 0);" /> <input type="button" onclick="document.title += 1" /> </body> </html>

[ Demo with 0 delay , 100 ms delay , 150 ms delay ]

And the following steps:

  • The user enters an input (focus).
  • User clicks a button.

Now the events will occur in the following order:

  • Text input blur event.
  • Button click event.

Checking this on all available browsers, I get:

 document.title = '21' //Expected behavior

But! In the production browser (Windows XP + IE 7) I get:

 document.title = '12' //Unexpected behavior

I also tried to simulate it in IE 7 mode on my local machine (IE 10), was not able to play it.

This is obviously a simplified example of the problem I am facing. Otherwise, I could just get rid of setTimeout.

In a real scenario, the call to setTimeout is actually made by a third-party script library (ASP.NET Dev Express components).

Besides the actual solution to this problem (which I think I can handle), what explanation can be applied to this behavior?

Update:

Using the expression new Date().getTime() to get the time of each step that the browser executes. This happens as follows:

 1387369361417 //document.title += 1 1387369361433 //document.title += 2
+6
source share
1 answer

Two possibilities:

  • Your click (mousedown + mouseup) ends before the IE7 minimum wait period.

  • The mousedown state blocks scripts. Events must wait for other scenarios and user interactions to complete before they start. And given the history of the script -UI strangeness / horror in IE, I would put that mousedown "starts user interaction", and mouesup "ends user interaction". Download this in IE7:

     <input type="text" onblur="window.setTimeout('output(2));', 0); output(3);" /> <input type="button" onclick="output(1);" />

    http://jsfiddle.net/sMcE3/

    ... and after you click focus () in the text box, click this button in real time. I assume you will see 312 . (Unlike 321 , which will show any semi-decent browser.)

+1
source

More articles:


All Articles