2012年9月10日月曜日

jquery mobile のページ切り替えの挙動(イラッ

とにかくajaxの挙動がおかしい!それでも使いたい!って方用にメモを残しておく。

ページ切替イベントに
http://dev.screw-axis.com/doc/jquery_mobile/api/events/page_transition/about/

pagebeforehide
pagebeforeshow
pagehide
pageshow
の4つがあると記載してあるけど、実はもう一つあって
ページ遷移先のdiv[data-role="page"]タグ内にある<script>タグがある。

scriptタグはページを読込んだ直後に実行されるので、
pagebeforchangeよりも早く実行される。
data-prefetchした場合は裏でajax通信した時に読込む。
これが一番の問題。

どういうことかというと、ページ切替前にscriptが解釈されてしまうので、
当然ページ切替後に反映される事はない。

リロードしたときはうまくいくのに、ページ移動だとうまく行かないっていうのは
ここが原因となっているので、
ウェジット回りのイベント処理などは、素直に

jquery mobileでイベント処理をやらない


これが対策。

jquery mobileでイベント処理をやらない

がとても重要。

  具体的には、
1.ページ切替などそういった処理はヘッダー内scriptに記述して、できるだけ
処理を入れないようにする。
2.ウェジット回りのイベントはhtml内のdiv[page]内scriptタグで記述して、
onclickタグやonchangeタグを使って呼び出すようにする。

これだけ制約すれば素直に動いてくれるはず。

0 件のコメント:

Androider