jQuery Mobile メモ - “automatic AJAX page loading”を無効にする

AJAX page loading でアニメーションページ変移されるのは格好良いので是非とも使いたいのですが、なぜだかうまく次のページが表示されないことがあります。

相性が悪いのか、理解が足りないのか、まだ不具合があるのかはよくわかりません。

aタグでの遷移は rel="external" を付加して

<a href="http://sinkan.net/" rel="external" data-role="button">新刊.net</a>

と書けばいいのですが、なぜかフォームだとうまくいきません。*1

後々に付加したタグを解除するのも面倒なので、以下のようにまとめて無効化しました。

<script src="jquery/jquery-1.4.4.min.js"></script>
<!-- jQueryMobile CUSTOM -->
<script type="text/javascript">
$(document).bind("mobileinit", function(){
  $.extend( $.mobile , {
    ajaxLinksEnabled: false,
    ajaxFormsEnabled: false
  });
});
</script>
<script src="jquery/jquery.mobile-1.0a2.min.js"></script>

ajaxLinksEnabled が通常のリンク、ajaxFormsEnabled がフォームでの遷移となります。

ポイントは、jQuery MobileのJavaScriptを読み込む前に書くことです。

他にも初期設定値を変更することができるようです。

詳しくは、以下を参照ください。

Docs and Demos - Working with jQuery Mobile’s Auto-initialization

Permalink | コメント(6) | トラックバック(0) | 06:08

*1：これはいまだに未解決

コメントを書く

わた 2010/11/24 21:34 感謝！　解決しました。

YOD-Y 2010/11/26 21:11 お役に立てて幸いですｗ

oky 2010/12/01 09:07 どうやら、auto ajax loading の直後、find関数がロクに機能しなくなることがあるようです。(例 $element.find("[data-role]") )。うまく動作するところも散見されるので、原因は謎。詳細判明したらまた報告します。

oky 2010/12/01 12:33 jquery-1.4.4(l.4095) の "qSA works strangely on Element-rooted queries" からの対策が悪さをしているようです(1.4.3以降)。当方では単に 4108行目を makeArray( context.querySelectorAll(query), extra ); とすることで動きましたのでご参考まで。
としてやれば動きました。

YOD-Y 2010/12/01 13:19 フォーラムの方にも引数がないURLだとダメだという報告がありますね。
この場合はURL末尾に'?'を付加するだけでも大丈夫だとか。
階層があっても大丈夫なようで、そのせいで公式デモは問題が無いように見えているようです(笑)

なお私が試した時は、α1(with jquery1.4.3)の頃からうまくいかない場合があったので他にも相性があると考えています。

銀 2010/12/17 20:56 丁度探していた内容にぴったりの記事にでした。大変助かりました！
alpha2 ではまだ少し、不思議な挙動がありますね…

スパム対策のためのダミーです。もし見えても何も入力しないでください

画像認証

トラックバック - http://d.hatena.ne.jp/YOD-Y/20101117/1290028091

リンク元

		2010/11
日	月	火	水	木	金	土
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30

YOD-Yのへたれ開発日誌

2010年11月17日

jQuery Mobile メモ - “automatic AJAX page loading”を無効にする

Docs and Demos - Working with jQuery Mobile’s Auto-initialization