web開発においてiPad iOS8 Safari でうまく動かなかったこと
web開発においてiPad iOS8 Safari でうまく動かなかったこと:
もしかしたらiPad iOS8 Safariという組み合わせだけの問題ではないかも知れません(それぞれ単体でも再現するかも知れません)。中にはSafariだけでなくChromeでも再現するものもありました。
この記事でやっているように動的にセレクトリストの内容を変更している場合に、変更後何かを選択してしまっている状態になってしまうのを回避したかったのです。
ちなみに試していないですが
他のブラウザでは中央寄せになっているのにiPadだけでは左寄せになっていたり、そもそもそのスタイルをつけている要素が表示されていなかったりしました。
この問題はweb上にも沢山報告されていました。
また他にも見つけたら随時更新します。
そしてここに挙げたものはあくまでも'対応例'としてお考えください。
iPad iOS8 Safari
もしかしたらiPad iOS8 Safariという組み合わせだけの問題ではないかも知れません(それぞれ単体でも再現するかも知れません)。中にはSafariだけでなくChromeでも再現するものもありました。
1.セレクトリストでvalue値を取得するときにjQueryの.val()
だと取得できない
対応...
on change
イベントでe.target.value
かdocument.getElementById('selectLists').value
で取得できました。
2.セレクトリストで動的にリストを変えている場合に何かを選択してしまう(ユーザーが選択するまで何も選択させたくない)
対応...
この記事でやっているように動的にセレクトリストの内容を変更している場合に、変更後何かを選択してしまっている状態になってしまうのを回避したかったのです。$("#selectLists").prop("selectedIndex", -1);
のようにすると選択を解除できます。ちなみに試していないですが
-1
でなく0
でも良いかも知れません。
3.styleのdisplay: flex;
がついていると想定通りの表示にならない
対応...
display: block;
とかに変えました。。。他のブラウザでは中央寄せになっているのにiPadだけでは左寄せになっていたり、そもそもそのスタイルをつけている要素が表示されていなかったりしました。
この問題はweb上にも沢山報告されていました。
まだあるかも
また他にも見つけたら随時更新します。そしてここに挙げたものはあくまでも'対応例'としてお考えください。
コメント
コメントを投稿