12

テキスト入力にフォーカスしたときに Android キーボードが表示されない問題があります。ページを初期化する関数にこれがあります：

jQuery(document).bind('pageshow', function()
{
    jQuery($inputItemReference).focus();
    jQuery($inputItemReference).prompt();
});

$inputItemReference は、入力テキスト ボックスを指す変数です。

prompt() でキーボードが表示されると言われました。ただし、そうではありません。ページの読み込み時に点滅カーソルを表示するための入力しか取得していません。キーボードを表示したい場合は、入力をもう一度タップする必要があります。ページが読み込まれたときにキーボードが表示されるようにします。何かご意見は？ありがとう。

4

5 に答える 5

1

この回答に基づいて、 javascript で携帯電話に仮想キーボードを表示する、それはすぐに可能ではありません。

少なくとも iOS (iPhone) ではできませんし、Android でも同様だと思います。ユーザー入力以外でキーボードをトリガーできないようにするのは、使いやすさの問題です (自動だと面倒です)。

これを回避するために私が知っている方法がいくつかあります。

prompt()キーボードを開きます イベント.focus()内から(たとえば、ダイアログを開くことで)をトリガーすると、キーボードが表示されます.click()

于 2013-01-17T01:24:52.487 に答える
0

わかりましたので、これをある程度行う方法を見つけました。Android の Chrome でテスト済み。これが jsFiddle です: http://jsfiddle.net/Twisty/x0tcr5ph/2/

JQuery:

$(document).on("pageshow", "#loginDialog", function () {
    // When entering loginDialog
    $("label:first").click();
});
$(function () {
    $("#startBtn").click(function () {
        $.mobile.changePage('#loginDialog', 'pop', true, true);
    });
});

HTML:

<div data-role="page">
    <div data-role="header" data-theme="b">
         <h1>Test Focus onLoad</h1>
    </div>
    <div data-role="content"> <a href="#" id="startBtn" data-role="button">Login</a>
    </div>
</div>
<div id="loginDialog" data-role="dialog">
    <div data-role="header" data-theme="b">
         <h2>Login</h2>
    </div>
    <div data-role="content">
        <form>
            <label for="text1">User</label>
            <input type="text" name="login" id="text1" />
            <label for="text2">Password</label>
            <input type="password" name="pass" id="text2" />
            <button type="submit">Submit</button>
        </form>
        <script>
            $("label:first").click(function() {
                $("#text1").focus();
            });
        </script>
    </div>
</div>

click()ログイン ダイアログが開くと、イベントを通じてフォーカスがテキスト ボックスに送信されます。これは、すべての要素がロードされた後に実行さfocus()れ、キーボードが表示されるため、ユーザーはすぐに入力を開始できます。

を使用して、ページの読み込み時に同様のことができると思われますpagecontainerload。

于 2015-02-02T22:57:34.973 に答える
-2 
// Place an empty div at the bottom of your page
<div class="keyboard" style="height: 0">&nbsp;</div>

$("input").click(function () {
    $("#" + this.id).focus();
});
$("input").focus(function () {
    $(".keyboard").css("height", "300");// The height of your keyboard
    window.scrollTo(0, 5000); // Scroll to the bottom of the page
});
$("input").blur(function () {
    $(".keyboard").css("height", "0");
    window.scrollTo(0, 0);
});
于 2015-04-27T03:08:32.080 に答える