18

i have the following function

 function change() 
 {
       var input = document.getElementById('pas');
       var input2 = input.cloneNode(false);
       input2.type = 'password';
       input.parentNode.replaceChild(input2,input);
       input2.focus();
  }

but focus() doesn't work in ie7, so what can i do! i want to have the cursor inside of input!

thanks

update

great solution, thanks, but now it doesn't work in opera:(

1
  • Good thing that nobody actually uses Opera 😂
    – Batkins
    Jan 30, 2019 at 23:35

8 Answers 8

40

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 ) ;
9
  • @zaf yes man, it works fine;) but now i've notised, that it doesn/t work in opera:)
    – Simon
    Apr 8, 2010 at 13:45
  • Updated my answer with a possible solution. Let us know if it works for you.
    – zaf
    Apr 8, 2010 at 14:09
  • 3
    I enjoyed the straightforward 'due to it being lazy' explanation :)
    – wooters
    Sep 2, 2015 at 18:27
  • 1
    How would you recommend making this solution more dynamic to varying load times of the page?
    – nuccio
    Sep 10, 2020 at 16:29
  • 1
    @Zaf, Thanks, this ended up being the solution.
    – nuccio
    Sep 21, 2020 at 20:14
3

We hit the same issue. For focusing we are using General function which is applying settimeout solution mentioned in: http://www.mkyong.com/javascript/focus-is-not-working-in-ie-solution/ with 100 milliseconds.

Still on some screens it's not working properly. Especially when iframes are included. There is another known and similar IE issue:
IE 9 and IE 10 cannot enter text into input text boxes from time to time -> IE 9 and IE 10 cannot enter text into input text boxes from time to time

What I have noticed is when you have focus, without pointer, you can apply workaround by pressing TAB key (focus on next element) and than SHIFT+TAB which will return to our target element with focus and typing pointer. In order to be sure we can type inside input we focus on random element and then on our target input.

$('body').focus();
n.focus();

So we applied the same solution in javascript/JQuery in our general focus function. So there is an if statement

...        
if($.browser.msie) {
    setTimeout(function() { try {
        $('body').focus(); //First focus on random element
        $(n).focus(); //Now focus on target element
    } catch (e) { /*just ignore */ } }, 100); //See http://www.mkyong.com/javascript/focus-is-not-working-in-ie-solution/
} else { //Standard FF, Chrome, Safari solution...
...

To be sure since there is big regression we are still keeping solution with settimeout as a backup. Tested on IE10, IE11, Firefox 45, Chrome 49.0.2623.87

0

IE7 does not support the focus() method. I don't see any method.

2
  • @Kangkan maybe via javascript or jquery i can rich it?
    – Simon
    Apr 8, 2010 at 13:36
  • @Syom: I tried Javascript, but not the way shown by @zaf. @zaf: thanks. A nice way to go.
    – Kangkan
    Apr 8, 2010 at 17:00
0

I've had the same issue and was able to get IE to work using code behind by making a SetInitialFocus function and calling it in my PageLoad function.

Take a look at the following example and give it a shot, it worked for me. http://www.cambiaresearch.com/c4/df9f071c-a9eb-4d82-87fc-1a66bdcc068e/Set-Initial-Focus-on-an-aspnet-Page.aspx

0
function change() {
    var input = document.getElementById('pas');
    var input2 = input.cloneNode(false);
    input2.type = 'password';
    input.parentNode.replaceChild(input2, input);
    setTimeout(function () {
        input2.focus();
    }, 10);
}
1
  • 1
    You may want to explain your answer for the benefit of the OP
    – Luca
    Oct 20, 2012 at 1:36
0

In Case you are looking to set focus in 1st input element of last row in table.Name of my div where i have kept my table is tableDiv and i am setting focus to last row's 1st inputtext

setTimeout(function(){                
    $($('#tableDiv  tr:last').find('input[type=text]')[0]).focus();
},2);
0

@Bojan Tadic THANK YOU!

Below Code did the trick :)

$('body').focus(); //First focus on random element

I think the issue comes up when you use input and a placeholder. Managed so solved this thanks to this answer, I was missing that $(body).focus. Made this code to run only on IE so that all my inputs can be freely accessed by 'tabbing'. Previously when I had only tabIndex on my inputs I was able to move to the next one but focus wasn't complete and couldn't write anything in it.

This is complete code.

$('input[name^="someName"]').on('keydown', function(e){
    var keyCode = e.which || e.keyCode;
    if(keyCode === 9){
        e.preventDefault();
        $('body').focus();
        var nextTabIndex = parseInt($(this).attr("tabIndex"));
        nextTabIndex++;
        setTimeout(function(){$('input[tabIndex=' + nextTabIndex +']')[0].focus();},20);
    }
});
-2

Its is very easy using jQuery, not sure why you are doing it the hard way :) In this example I have a class assigned to the input field I want the initial focus set called initFocus. You can use any selector you want to find your element. from your code I would use $("#pas").focus();

$(".initFocus").focus();
4
  • Funny works for me in IE and always has.... Yes, just tried it in IE9,8 & 7. worked in every one of them. make sure your selector actually selects the input field you are tring to set your focus.
    – Chris Love
    Jan 16, 2012 at 21:36
  • Doesn't work in IE for me either. But I do know that other websites use $(".something").focus();
    – Arrow
    Jun 28, 2012 at 5:28
  • Same, am having problems with this in IE 7. Additionally, if you have more than one element with the class .initFocus which one do you expect it to "focus" on?
    – akousmata
    Feb 13, 2013 at 16:31
  • if you have multiple elements you are trying to set focus I think it just ignores the request.
    – Chris Love
    Feb 20, 2013 at 14:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.