Open mobile keyboard automatically

Asked

Viewed 2,213 times

3

Currently I have the following block attached to user action.

$(".class-botao").focus()

When the user interacts with the page the mobile keyboard is displayed normally.

However in my application there is a method that checks if there is any empty input when loading the page and if there is one .focus() in the element; 

autoFocus: function(scope) {
    var firstInput = $('.class-input.empty:required').filter(':first:visible');

    if (!firstInput.length) {
        return false;
    }

    firstInput.focus();
    return true;
},

Everything works normally but the keyboard does not appear (IOS/Android),

I’ve tried to simulate events .trigger('click // touchstart') shortly after the focus(), but nothing on the keyboard :/

Does anyone have any tips ?

javascript keyboard
  • 1

    "However in my application there is a method that checks if there is any input vázio when loading the page", Is this your method? If yes, ask the question and someone will help you

  • 1

    Edited friend, Rigadão by tip :)

  • Puts tbm relevant html and css for verifying functionality. Reading your function seems to me to be ok, but you are sure that firstInput is getting only one element and not a collection containing only one item?

1 answer

2

The virtual keyboard of mobile devices can only be activated by user actions, by definitions of usability.

Thus, the correct method to invoke the keyboard of mobile devices is through the type of input element, for example:

<input type="text" /> automatically invoke the default alphanumeric keyboard when receiving focus, while
<input type="number" /> will invoke the numeric keypad

There are two exceptions for javascript:

  • Some say the global method prompt() works
  • Trigger the event focus within events raised by user action, for example: click, mousedown, or mouseup

Browser other questions tagged javascript keyboard

You are not signed in. Login or sign up in order to post.