mobileのsafariでページを表示した段階でfocusをあてたい(入力可能な状態にしたい)

Question

mobiieのsafariにて、画面を表示した段階でfocusをあてて入力可能な状態にしたいのですが
focusが上手く動作しません。
(focusがあたってはいるのかもしれませんが、キーボードが表示されない状態です)

iOSのsafariの場合、clickなどのイベントにbindしたらfocusが効くようになるとの記事等は見つけたのですが、click自体しないでfocusを当てておきたいため、上手くいっておりません。

<form id="sample">
   <input type="text" id="text" />
   <input id="bind" type="button" value="バインドさせるボタン" />
</form>

$(document).on('pageshow', '#sample', function() {
   var onClickHandler = function () {
      $('#text').focus();
   }
   $('#bind').on('click', onClickHandler);
   /*  #bindをクリックすると#textにfocusはあいますが、
   *  setTimeout('$("#bind").click()', 1000);
   *  のように操作してもキーボードが表示されない状態です
   */
});

どなたか方法をご存知のかたはいらっしゃいますでしょうか。
よろしくお願いします。

Answer 1

StackOverflowの回答によると、ユーザビリティの観点からサポートしていません。
とあるので諦めるか

あるいは、A→Bの遷移でBのinputにフォーカスしたいとしたとき
A内のリンクをクリックしたときに、Bのページに遷移する代わりに、AjaxでAのページをBの内容に書き換えてinputにフォーカスさせる等するしかないのではないでしょうか。

Answer 2

clickなど、特定のイベントから呼ばないとfocusが動作しないということでしたら、.click()を使って、「押したことにしてしまう」という手段はどうでしょうか。

Comments

[takaashi]

setTimeout('$("#bind").click()', 1000);
などでclickイベントを発生させて試してみたのですが、テキストボックスが青枠で囲まれ、一見focusがあたっているようなのですが、キーボードがでないので入力ができない状態になってしまいます。

Answer 3

$(document).ready(function(){});

でやったらどうでしょう？

Comments

[takaashi]

回答ありがとうございます。
試したのですが変わりませんでした。
PCでは期待通りの動作をするのですが、iOSでは上手くいかないんです。。。

[退会済みユーザー]

どうも、仕様のようですね。
WebViewなどではkeyboardDisplayRequiresUserActionというプロパティをOFFにすればいいようですが、mobile safariではそういうのが見当たりませんでした。

昔は抜け道があったようですが…

[takaashi]

WebViewではそんなプロパティがあるのですね。。。
今もどうにか回避できればよいのですが…
ありがとうございます！

[退会済みユーザー]

すいません、私が勘違いしていたのですが、
$("#bind")タップでキーボードが表示されればよいのですか？

そうすると、おかしな挙動でキーボードを開くことは出来ました。
もうちょっと試してみます。

[退会済みユーザー]

上記動作で良ければ、

(function () {

$(document).ready(function(){

$("#bind").on('click', function() {
$("#text").focus();
});

$("#bind").focus().click();　//←ここで画面上のエレメントにclickイベントを発生しておく。

});

})();

こんな感じですね。

[退会済みユーザー]

画面表示と同時にテキストフィールドにフォーカスしてキーボードを出すのは、やはりダメのような…

[退会済みユーザー]

すいません、なんか、混乱してきて変な事を書いたかもしれません…