本当に奇妙なバグに関する情報をここで探しています。私自身と別の同僚は、しばらくの間、これを修正しようとしてきました。関連するSO投稿のすべてではないにしても、ほとんど見てきましたが、この問題に直接対処しているようには見えません。
非常にシンプルなモバイル Web フォームがあります。このフォームの流れは次のとおりです。
Select > Input[type=text] > Select > Select > Input[type=text] > Button
これが問題です。iOS デバイスのユーザーが選択をクリックすると、フォーム ヘルパーがポップアップし、ユーザーは値を選択できます。
ユーザーがフォーム ヘルパーの「次へ」の矢印をクリックすると、次の「入力」がフォーカスされ、キーパッドが開き、ユーザーが入力できるようになります。ただし、テキスト入力はテキスト入力に追加されません。
これは、要素のいくつかの jquery イベントといくつかのログ ステートメントによって確認されました。入力は実際にフォーカスを受け取り、その入力の各キープレスイベントはログに記録されていますが、テキストはありません?!?!?!?
ユーザーが最初の選択をタップし、(フォーム ヘルパーで) [完了] をクリックしてから、次のテキスト入力を手動でクリックすると、キー入力が機能し、テキストが入力に表示されます。
この同じバグは、ボタンの直前の 2 番目のテキスト入力でもまったく同じ方法で発生します。ユーザーがフォーム ヘルパーで「次へ」の矢印ボタンを使用すると、実際の入力フィールドにテキストは追加されません。
JavaScriptを使用してこれを強制的に機能させるいくつかの「ハック」を念頭に置いていますが、できればそれを避けたいと思います。しかし、それらはすべて他のバグを引き起こす可能性があり、これはフォーカス、ぼかし、クリック イベントのモバイル サファリ処理によってさらに強化されます。
助言がありますか？
- アップデート -
Apple サポート フォーラムで、まったく同じ問題を抱えている人を見つけました。
https://discussions.apple.com/thread/5527146
iframe にあるフォームに関連していることがわかりました。また、クリックされた最初の入力は、問題を再現するドロップダウンでなければなりません。
こんにちは、以下は私が問題に直面しているリンクの1つです。
http://182.74.28.109/H3G/Main.html再現する手順
- プロバイダーのドロップダウンをクリックします。
- ドロップダウンから 1 つのアイテムを選択します。
- [完了] をクリックする代わりに、[>] をクリックします。
- これにより、カーソルが名前フィールドに移動します。
- ここで、テキスト ボックスにテキストを入力してみます。
- テキストボックスには何も入力できません。
フォームが iframe にない場合、これは存在しません。
「次へ」ボタンを押した後の入力にフォーカスがあることをjavascriptで確認しました。また、押されているボタンが登録されていることを確認しましたが、何らかの理由で値が入力自体に追加されていません。
これは、これがある種のモバイルサファリバグであると私に信じさせます。つまり、修正が行われるまでにはしばらく時間がかかる可能性があり、たとえ修正が行われたとしても...すべての古いデバイスがそれを受け取るわけではありません（実際には、これが存在するかどうかはまだわかりませんiOS レガシー デバイス）。
押された文字を検出し、デコードして入力に追加する基本的な概念実証がありますが、せいぜいハックです。ネイティブ機能をシミュレートするには、ここまでしかできません。特定の入力用のバックスペースやスペースバーなど、特別なボタンもシミュレートする必要があります。最後の溝の修正として、これを実現するプラグインを実装するかもしれませんが、おそらくネイティブ入力のすべての機能を備えているわけではありません。この道を行くのは嫌だ。