focus() is not working in IE ? – solution

The focus() method is used to give focus to a textbox, or other html components. Here is a simple example to make a textbox focus automatically after page load.

<html>
 
<head>
<title>focus is not working in IE</title>
</head>
<body>
 
<form >
    <input id="myInput" type="text" value='testing'><br>
</form>
</body>
 
 <script type="text/javascript">
	document.getElementById('myInput').focus();
</script>
 
</html>

The above code is working fine in Firefox (FF), but not in Internet Explorer (IE). Actually the IE is supporting the focus() method, we just need to use other way to write the focus method.

Base on my personal observation, this is because IE run the focus() method before the textbox render properly. However the Javascript is put after the textbox, the focus() method suppose to execute after textbox fully render itself, may be IE treat it as different ways? Ya, IE always have “IE-ONLY” implementation…

Here is an unofficial solution, we have to use the setTimeout() fucntion to delay the focus() execute time.

setTimeout(function() { document.getElementById('myInput').focus(); }, 10);

After delay the execute time, the focus() is working fine in IE , or even FF.

<html>
 
<head>
<title>focus is working in IE</title>
</head>
<body>
 
<form >
    <input id="myInput" type="text" value='testing'><br>
</form>
</body>
 
 <script type="text/javascript">
	setTimeout(function() { document.getElementById('myInput').focus(); }, 1000);
</script>
 
</html>

Reference

setTimeout() – http://www.w3schools.com/htmldom/met_win_settimeout.asp

Tags :

About the Author

mkyong
Founder of Mkyong.com and HostingCompass.com, love Java and open source stuff. Follow him on Twitter, or befriend him on Facebook or Google Plus. If you like my tutorials, consider make a donation to these charities.

Comments

  • Jared Beach

    Thank, you. This works fine in IE 8 running in compatibility mode.

  • Pingback: Javascript: Trouble getting window to focus() in IE | Technology & Programming Answers()

  • Pingback: IE7?8?focus()?????? | ?????()

  • Sathish

    Thanks a lot bro.Its working fine

  • ali

    Thanks!

  • A M

    It’s works!!!

  • http://yahoodiary.com/blog/29836/making-use-of-chilly-contacting-to-come-across-work-opportunities/ Doris

    Great information. Lucky me I discovered your website by accident (stumbleupon).
    I’ve bookmarked it for later!

  • http://www.abhijat.name Abhi

    Thanks that worked like a charm

    I wonder why lJS ibraries like JQuery can not implement this

  • ramesh

    setTimeout(function() { document.getElementById(‘myInput’).focus(); }, 1000); it works fine
    but it’s focusing for every 1000 seconds to that element and it’s calling infinitely to focus the element..
    It’s not the correct one.. becoz performance of an application degrades.. if we use infinite loop…

  • Daniel

    Thanx, using setTimeout is such a POG*

  • Charles

    Thank you very much, this indeed helped! Without timeout only chrome set the focus right, now firefox and ie are working too!

  • Pingback: Power of YUTORI » IE7,8?focus()?????()

  • PRG

    Nice one! After a great search got this working!!

  • Pingback: focus doesn't work in IE | Easy jQuery | Free Popular Tips Tricks Plugins API Javascript and Themes()

  • Jack

    Awesome! It works wonders

  • denis

    Thank you!! IE is really strange browser!

  • http://empleoendf.com empleo df

    Exelent. thanks

  • kk

    katu thanks for answer..

    document.form1.textq.select();
    document.form1.q.focus();

    worked for me

  • sudhakar

    Thanks Bro
    It saves my time

  • Jared

    Like Chris, setTimeout worked for me only about half of the time on IE, but calling focus() twice seems to work 100% of the time. Thanks much!

  • http://www.tanweerbravi.webs.com tanweer

    Thanks so much for the post, it really solved my big issue. Once again thanks.

  • http://thestudymachine.com Dan

    The focus() twice worked for me for most instances.

  • Chip

    Thank you! Fixed my IE problem.

  • http://www.underbjerg.com Erik

    Chris: Your solution of calling focus() twice works like a charm, at least on IE 8 and Firefox.

    I also had problems with field focus on Internet Explorer (8), and tried the timeout approach, which I couldn’t get to work reliably.

    Thanks!

  • http://www.azokan.com katu

    This does not work for me, but I fixed the problem with
    document.form1.textq.select();
    document.form1.q.focus();

    where textq is the id of the input text and q, the name of the input text.

    i hope this is usefull for someone

  • Chris

    Hi,

    I recently had a similar problem, and Google lead me to your website. I tried your “setTimeout()” approach, but it didn’t behave reliably across my test machines. What I eventually did was call focus() *twice* instead:

    var element = document.getElementById(‘myInput’);
    element.focus();
    element.focus();

    Astonishingly, this give the field focus correctly in both IE6 and IE7. Firefox and Chrome only need focus() to be called once (of course) for the correct behaviour :-).