PhoneGapで作ったアプリをiOS9の端末で実行した際、jQuery mobileの挙動がおかしかったのでその修正方法をまとめます。
現象
・ポップアップを開くリンクをクリックした際に初回だけ表示されない
(表示されるが一瞬で消える)
・ ポップアップを閉じた時に前のページに遷移してしまう。
実行環境
・iPhone 5 iOS8.3(正常)
・iPhone 6 iOS9.1(異常)
対策の流れ
- PhoneGapを最新版にアップデート
- プロジェクトにPhoneGapの最新版を適用
- htmlのソースを一部修正(※ここだけでOKかも)
PhoneGapを最新版にアップデート
ターミナルを開き、プロジェクトのディレクトリまで移動した後に以下のコマンドを実行します。
sudo npm update phonegap -g
#Cordovaの場合はこちら
sudo npm update cordova -g
プロジェクトにPhoneGapの最新版を適用
sudo phonegap platform update ios
#Cordovaの場合はこちら
sudo cordova platform update ios
htmlのソースを一部修正
この工程だけでも良いかもしれませんが、私の場合は上記1,2を先にやってしまったので検証できません。
修正前:
index.html
<!-- リンク -->
<a href="#pp" data-rel="popup">ポップアップ!</a>
<!-- ポップアップの中身 -->
<article data-role="popup" id="pp">
ポップアップ!
</article>
修正後:
index.html
<!-- リンク -->
<a href="#pp" data-rel="popup">ポップアップ!</a>
<!-- ポップアップの中身 -->
<article data-role="popup" id="pp" data-history="false">
ポップアップ!
</article>
ポップアップの中身の方にdata-history="false"を追加したら治りました。
引用元(StackOverFlow)