web-dev-qa-db-fra.com

focus de saisie dans jquery mobile, mais le clavier n'apparaît pas

J'utilise jquery, jquery mobile et phonegap ..__ Je veux montrer au clavier cette page avec le type d'entrée = "text".

    <section id="page1" data-role="page">
        <header data-role="header">
            <h1>jQuery Mobile</h1>
        </header>
        <div data-role="content" class="content">

            <input type="text" placeholder="입력하세요" />
        </div>

    </section>

et mon script est

        $(document).ready(function(){
            $('input').select();
            $('input').focus();
        });

Le champ de texte est ciblé mais le clavier n'est pas affiché. Il est lancé lorsque vous tapez sur type = "texte". Comment puis-je forcer à lancer le clavier en javascript ou en utilisant le plugin phonegap?

keyboardjquery-mobilecordova
25
Taewan Hwang

Aucune des solutions précédentes n'a fonctionné pour moi. Cependant, j'ai remarqué que $ ('textarea'). Focus (). Select (); travaillé après avoir accédé à la page une deuxième fois. Donc, je force le jquery mobile à data-prefetch ma page de boîte de commentaire.

Voici mon code d'initialisation JQM générique (qui ne fonctionne pas sans 'data-prefetch'):

$('#comment-box-page').live('pageshow', function () {
   $('textarea').focus().select();
});

La page de liste contient une fausse image d'une petite zone de texte, qui redirige vers comment-box.html, qui est simplement une grande zone de test avec des boutons de publication et d'annulation.

        <div data-role="footer" data-position="fixed" data-theme="b" data-tap-toggle="false">
        <div data-role="fieldcontain">
            <a href="comment-box.html" data-prefetch><img src="fake-textfield.jpg"/>
            </a>
        </div>
    </div>
  • data-prefetch est ce qui fait la différence. Lorsque vous cliquez sur le lien, la page se comportera comme si c'était la deuxième fois que vous la visitiez, activant ainsi le focus et activant le clavier.
4
Franklin Dattein

vous ne pouvez pas. le navigateur mobile ne montre pas le clavier si vous mettez un élément d’entrée au point L'utilisateur doit appuyer sur l'élément d'entrée.

3
Daniel Kurka

Vous devez utiliser l'événement "click" pour ouvrir le clavier:

$(document).live('click', function() {
    $("#input-element-id").focus();
});
1
Christian Strang

j'utilise ceci dans Cordova 6 pour l'application mobile Android et ses travaux:

-installation du clavier plug-in cordova: plugin cordova add cordova-plugin-keyboard

-Alors vous pouvez utiliser Keyboard.show () pour afficher le clavier et keyboard.hide () pour le masquer

  • vous pouvez le faire pour afficher le clavier:

      $("#your_text_input").click(function () {
                $(this).focus();
                Keyboard.show();
  });

  $('#your_text_input').keydown(function(e) {
  if (e.which == 13) { //Enter keycode
    //your action
    ...

    // Now clear input and set focus back to input
    Keyboard.hide();
    $(this).val('').trigger("keyup").focus();
  }
  });
0
rara83