IOS 8.0では、AppleがiPhoneのSafariに新しいバグを導入しました。これは、複数の_<select>
_要素を使用する場合に非常に深刻だと思います。たとえば、生年月日を選択するためによく使用されます。再現するには:
それぞれに複数の_<select>
_がある2つの_<option>
_でページを作成します
IPhoneのiOS8のSafariで開きます(バグは8.0.2にまだ存在します)
最初の_<select>
_をタップします
3番目のオプション、つまり3月を選択します
_<select>
_が選択したものに更新されないことに注意してください(iOS 7では更新されます)
2番目の_<select>
_要素をタップします
次の点に注意してください。
<select>
_は更新されません<select>
_は3を示します(これは最初の_<select>
_の位置です)最初と2番目の_<select>
_を交互にタップすることでこれを繰り返すことができ、同じパターンで変化することに注意してください。パターンを知らない限り、これはランダムに表示される場合があります)。あなたが年ピッカーも持っているなら、それはさらに混乱しているように見えます。
モバイルデバイスで試すには、次のjsfiddleを試してください: http://jsfiddle.net/m7baw590/6/embedded/result/
また、onchange="alert(this.value)"
は誤った値を報告します(2番目の_<select>
_要素で選択されたものと同じです。これはここで確認できます: http://jsfiddle.net/m7baw590/ 7 /埋め込み/結果/
各選択の間に[完了]をクリックするか、矢印を使用して切り替えると、これらのバグは発生しません。
これに対する回避策はありますか?
私はこの方法で問題を解決しました:
<select>
<option></option>
<option></option>
<option></option>
(...)
<optgroup disabled></optgroup>
</select>
空の<optgroup>
を<select>
に追加しました。
IOS8の選択フィールドに別のバグを発見しました(たとえば、iPhoneでのみ、iPadで問題ないようです)。
再現方法:
私がiphoneSafariで見つけた唯一の解決策は、他のすべての選択ボックスをオンフォーカスで無効にし、すべてのオンブラーを再度有効にすることです。これにより、ユーザーはプッシュ完了を強制されます。