Louis
Louis

Reputation: 123

Focus doesn't work in input on chrome

This code can work on IE, but can't work in input on chrome,

 onkeyup="javscript:if(event.keyCode ==13){frm1.identifyCode.focus();}"

I tried to set timeout but still doesn't work.

setTimeout(function(){frm1.identifyCode.focus();},0);

Upvotes: 2

Views: 7550

Answers (5)

user21960698
user21960698

Reputation: 1

Set focus to the element,the browser must first be set to focus.

example:

browser_1.focus();
browser_1.document.getElementById('text_box').focus();

Upvotes: 0

Klaas Leussink
Klaas Leussink

Reputation: 2727

For what it's worth; I had a similar problem with a scrollable DIV that was not being scrolled by keyboard, unless I clicked in it first.

jQuery's focus() did the trick in Firefox, but Chrome was having none of it. After a good time trying every trick I found online, I eventually solved it by setting tabindex="0" on the element I wanted to focus on, which instantly made it focus-able for Chrome, solving my issue!

Make sure you set it to 0, and nothing else. See the MDN page for reference.

tabindex="0" means that the element should be focusable in sequential keyboard navigation, but its order is defined by the document's source order.

Upvotes: 0

Leo Moshko
Leo Moshko

Reputation: 19

Excel Gamboa is right, the transfer to end functions solved my problem. Example:

jQuery(".search-icon").click(function(){
    var $navbarToggler =  jQuery(".navbar-toggler");
    var $navbarCollapse = jQuery(".navbar-collapse");
    var $mobileSearch =jQuery('.search_mobile_form');
    var $mobileOverlay =  jQuery(".mobile-overlay");
    var $inputSearch = jQuery("#search");
    if( $mobileSearch.is('.show-search') ) {
        $mobileSearch.removeClass('show-search');
        $mobileOverlay.fadeOut();
    }
    else {
        $mobileOverlay.fadeIn("slow");
        $mobileSearch.addClass('show-search');
        $navbarCollapse.removeClass("show").addClass("collapse");
        $navbarToggler.addClass("collapsed");
        $inputSearch.focus();

    }
    return false;
});

Upvotes: 1

Exel Gamboa
Exel Gamboa

Reputation: 946

It is possible that you are making a call to an instruction or function after calling .focus() that is causing the field to be out of focus. Try to change the position of the .focus() instruction to the end of a function.

Note: If you are using ajax (just in case), put the focus instruction at the end of a success call.

Upvotes: 0

bot
bot

Reputation: 4911

Try changing your timeout to 1 it might fixed the issue . It will have a minimal delay and slow down execution in chrome. I think this is a bug on chrome.

setTimeout(function(){frm1.identifyCode.focus();},1);

similar question jQuery focus not working in Chrome

Upvotes: 2

Related Questions