iPhoneのSafariで入力フィールドにフォーカスが移らない



JavaScript(実際にはGWT)で、iPhoneのSafari上の特定の入力フィールドにフォーカスを移そうとしているのだが、Android上のchromeでは完全にうまく行くにもかかわらず、iPhoneではそうならない。

やっていることは、こうだ。

  • 入力フィールドに何らかの文字列を入力してEnterを押す。
  • その処理結果をダイアログで表示する。
  • ダイアログを消去した後にフォーカスを入力フィールドに当てる。
  • しかし、当たらない。タップする必要がある。

原因

iOSのMobile Safari上でのfocus()が妙な件を調べてみたに答えらしきものがある。

要するにこういうことだ。

  • focus()が効くのは特定のイベントのディスパッチ時のみ。つまり、クリック、マウス操作、タッチのいずれか。

こちらにも質問がある。スマホブラウザを開いたときにデフォルトでinput要素にフォーカスをあてて、かつソフトウェアキーボードをJavascriptで表示させたい。mobileのsafariでページを表示した段階でfocusをあてたい(入力可能な状態にしたい)

さらに調べてみると、この理由としては、「ユーザが新たなページを開いた時に、いきなりソフトキーボードが開いてしまっては困る」という理由のようだ。したがって、ユーザが何らかのアクションを行わない限り、絶対にフォーカスが当たらない仕様になっているものと思われる。

iPhoneではこのような馬鹿げた仕様が他にもある。(これはAndroidも同じだが)動画を表示した場合に、自動再生になっているにもかかわらず、タッチしない限りは絶対に再生しないのである。

PCと同じHTML5という規格を実装しているにもかかわらず、こういった特殊な仕様は辞めてほしいものだと切に願う。

Mobile Safari: Javascript focus() method on inputfield only works with click?

他の解決策1

(Sort of) Fixing autofocus in iOS Safariに解説と解決策らしきものがある。

解説としては、この仕様については何らのオフィシャルな説明も無いということだ。つまり、Appleのバカな開発者はユーザには何の説明もなく黙ってこういうことをしているというわけである。こちらとしてはたまったものではない。

そして、Appleの開発者はソフトキーボードが出るのをやめさせたのであって、フォーカスするのは何ら問題が無いという。だから、とにかく他の方法でフォーカスすれば良いという。

しかし、提示されている方法は、単純に「フォーカスされたような見かけを作る」ことに過ぎないと思われる(実際にやってみたわけではないが)。例えば、この状態でBluetoothキーボードから入力を受け付けることは無いのではないか?

他の解決策2

iPhoneのSafariを捨てることである。検索してみるとiPhone用Chromeにも同じ問題があるというが、iPhone用Firefoxでうまく行くという書き込みがある(こちらも未確認)。