jQuery Mobile 1.3.1とGoogle Analytics。

• facebook

オフィス狛　技術部です。

前回の「jQuery Mobile 1.3.1にバージョンアップしてみた。」の続きです。
前回から色々と調べていると、Google Analytics 埋め込みにも修正が必要な事が分かりました。

旧バージョンのjQuery Mobileでサイトを作成した時は、以下の記事を参考にしました。
jQuery MobileでGoogle Analyticsを使うために気をつけなければいけないこと

新バージョンでは動かない原因コードは以下の部分

$('[data-role="page"]').live('pageshow', function () {
  var u = location.hash.replace('#', '');
  u ? _gaq.push(['_trackPageview', u]) : _gaq.push(['_trackPageview']);
});

正常に動作するように修正したのが以下のコードです。

$(document).on("pageshow", '[data-role="page"]', function () {
  var u = location.pathname + location.hash;
  u ? _gaq.push(['_trackPageview', u]) : _gaq.push(['_trackPageview']);
});

liveがonになっているのが主な変更点です。

実は今回、jQuery Mobile を1.3.1にバージョンアップするに伴い、
jQuery本体自体も1.9.1にバージョンアップしていました。
1.9.1では、liveは廃止になり、代わりにonを使用するようです。

参考：
jQuery 1.9 に更新する際に注意すべき変更点の自分なりのまとめ

※今回の記事と同じ対応をしている記事を見つけました。とても分かり易いです。
jQuery Mobile 1.3.1 で Google Analytics を設定するよ！

Google Analytics , jQuery Mobile