2013-04-16 3 views
0

Был предыдущий вопрос об использовании Google Analytics с jQuery Mobile с успешным ответом here. Однако это было для версий jQuery до 1.9.Google Analytics & jQuery Mobile & jQuery 1.9

Возможно, кто-то может помочь изменить код, чтобы переопределенное событие .live было заменено текущим событием .on. Я пробовал, но безуспешно.

Вот код JavaScript:

var _gaq = _gaq || []; 

$(document).ready(function(e) { 
    (function() { 
     var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 
     ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + 
      '.google-analytics.com/ga.js'; 
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 
    })(); 
}); 

$('[data-role=page]').live('pageshow', function (event, ui) { 
    try { 
     _gaq.push(['_setAccount', 'YOUR_ANALYTICS_ID_GOES_HERE']); 

     if ($.mobile.activePage.attr("data-url")) { 
      _gaq.push(['_trackPageview', $.mobile.activePage.attr("data-url")]); 
     } else { 
      _gaq.push(['_trackPageview']); 
     } 
    } catch(err) {} 

}); 
+0

Просто смените жить с на, конечный результат тот же. Или вы все равно можете использовать старое связывание методов, в отличие от live, оно все еще работает. – Gajotres

+0

@Gajotres 'on' не является прямой заменой' live'. Синтаксис вызова отличается для делегированных событий. – Walf

+0

Я никогда не говорил, что это была прямая замена, из моего опыта и официальной документации в настоящее время используется для связывания событий страницы. Не говоря уже об этом является официальным оператором jQuery live method: Начиная с jQuery 1.7, метод .live() устарел. Используйте .on() для присоединения обработчиков событий. Пользователи более старых версий jQuery должны использовать .delegate() в предпочтении .live(). – Gajotres

ответ

-1

После создания .live() для .on изменения(), я также должен был переместить скрипт из <head> и до конца <body>, как раз перед последний </div>, который был прикреплен к <div data-role="page">. В противном случае я не получил бы каждый просмотр страницы.

+0

Это все равно не будет должным образом прикреплено к делегированным событиям. – Walf

3

код Google дает на Tracking Info странице будет выглядеть примерно так, в зависимости от того, какие функции вы выбрали:

var _gaq = _gaq || []; 
    _gaq.push(['_setAccount', 'UA-XXXXXXXX-1']); 
    _gaq.push(['_setDomainName', 'foo.bar']); 
    _gaq.push(['_trackPageview']); 

    (function() { 
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 
    })(); 

И вы сказали, чтобы положить, что сразу после открытия <body>. Вы должны держать его в том же месте с JQuery Mobile (проверено на v1.3) путем удаления _trackPageview линии и добавляя простой фрагмент кода до конца этого кодового блока, что дает:

var _gaq = _gaq || []; 
    _gaq.push(['_setAccount', 'UA-XXXXXXXX-1']); 
    _gaq.push(['_setDomainName', 'foo.bar']); 

    (function() { 
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 
    })(); 

    $(document).on('pageshow', ':jqmData(role="page")', function(evt, data) { 
     var url = $(this).jqmData('absUrl'); 
     try { 
      if (url) { 
       url = $.mobile.path.parseUrl(url) 
       _gaq.push(['_trackPageview', url.pathname + url.search + url.hash]); 
      } 
      else { 
       _gaq.push(['_trackPageview']); 
      } 
     } 
     catch(e) {} 
    }); 
3

В дополнение к .live заменяясь на .on, Google заменяет ga.js на analytics.js как часть изменения Universal Analytics.

Я использовал вариант кода Walf для отслеживания отдельных страниц на сайте jQuery Mobile, но ему необходимо было изменить его для работы с новой конфигурацией Universal Analytics. У меня есть следующий скрипт сразу после тега тела:

(function (i, s, o, g, r, a, m) { 
i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function() { 
    (i[r].q = i[r].q || []).push(arguments) 
    }, i[r].l = 1 * new Date(); a = s.createElement(o), 
    m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m) 
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga'); 

ga('create', 'UA-XXXXXXXX-X', 'site_name.com'); 
ga('send', 'pageview'); 

$(function() { 
    $('[data-role=page]').on('pageshow', function (event, ui) { 
     try { 
      if (location.hash) { 
       ga('send', 'pageview', location.hash); 
      } 
      else { 
       ga('send', 'pageview'); 
      } 
     } 
     catch (error) { 
     } 
    }); 
}); 

страниц, перечислены местоположения хэш (например #about) в Google Analytics дает мне информацию, которую я хочу видеть, как посетители взаимодействуют с сайтом.

+0

Это будет работать только на страницах, существующих в DOM, а не на динамически загруженных, потому что вы не использовали делегированное событие. – Walf

0

После тега открытия тела:

<script> 
    (function(i, s, o, g, r, a, m) { 
     i['GoogleAnalyticsObject'] = r; 
     i[r] = i[r] || function() { 
      (i[r].q = i[r].q || []).push(arguments); 
     }, i[r].l = 1 * new Date(); 
     a = s.createElement(o), 
     m = s.getElementsByTagName(o)[0]; 
     a.async = 1; 
     a.src = g; 
     m.parentNode.insertBefore(a, m); 
    })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga'); 
    ga('create', 'UA-XXXXXXX-XX', 'exemple.com'); 
</script> 

И на каждой странице:

<div data-role="page" ...> 
    ... 

    <script> 
     $(document).off("pageshow", 'div[data-role="page"]').on("pageshow", 'div[data-role="page"]', function() { 
      ga('send', 'pageview', $.mobile.path.getLocation()); 
     }); 
    </script> 
</div> 
Смежные вопросы