focus doesn't work in IE
For IE you need to use a settimeout function due to it being lazy, for example:
setTimeout(function() { document.getElementById('myInput').focus(); }, 10);
From http://www.mkyong.com/javascript/focus-is-not-working-in-ie-solution/
For opera, this may help:
how to set focus in required index on textbox for opera
UPDATE:
The following snippet of code handles the case when the element is unavailable and retries after a short period - perfect for slow loading pages and/or elements not available until some time after.
setTimeout(
function( ) {
var el = document.getElementById( "myInput" ) ;
( el != null ) ? el.focus( ) : setTimeout( arguments.callee , 10 ) ;
}
, 10 ) ;
Focus is not working in IE even after adding much delay
https://stackoverflow.com/a/2600261/5086633 is for IE7.
Following works each time on all browsers.
<body onload="document.getElementById('testfocus').focus();">
You can see if the favicon shows a rotating circle(loading) as the focus will happen only when the loading is complete.
I tried with following which is working on all browsers:
<html>
<head></head>
<body onload="document.getElementById('testfocus').focus();">
<iframe src="http://www.healthcarereformdigest.com/wp-content/uploads/2014/07/forms.jpg"></iframe>
<input id="testfocus"/>
</body>
</html>
(Added iFrame and that image as its heavy and it takes looong to load).
If its failing in your app, you can press Tab to see which element has the focus and then Inspect that as it might have multiple focus() statements.
Unable to focus an input using JavaScript in IE11
The issue was focusing in IE11 is broken when the css property -ms-user-select: none
is applied to the input. So by changing:
* {
-ms-user-select: none;
}
into
*:not(input) {
-ms-user-select: none;
}
I was able to solve the problem. Here is a codepen for reproducing the issue:
http://codepen.io/anon/pen/yNrJZz
autofocus attribute on input field not working in IE 11
IE11 doesn`t support autofocus (despite is in caniuse).
You can check How to make input autofocus in internet explorer?
Related Topics
Determine Original Name of Variable After Its Passed to a Function
Check If a Variable Is a String in JavaScript
Determine Original Size of Image Cross Browser
Difference Between Knockout View Models Declared as Object Literals VS Functions
How to Get the Function Name from Within That Function
How to Implement Authenticated Routes in React Router 4
How to Turn JavaScript Array into Comma-Separated List
JavaScript Objects: Get Parent
How to Listen to the Form Submit Event in JavaScript
Add Event Listener on Elements Created Dynamically
Building a Promise Chain Recursively in JavaScript - Memory Considerations
Difference Between HTMLcollection, Nodelists, and Arrays of Objects
How to Mock an Es6 Module Import Using Jest
Difference Between Textcontent VS Innertext
Url Hash-Bang (#!/) Prefix Instead of Simple Hash (#/) in Angular 1.6
How to Prevent Submitting the HTML Form's Input Field Value If It Empty