Google Analytics & jQuery Mobile & jQuery 1.9

Il ya eu une question précédente sur l'utilisation de Google Analytics avec jquery Mobile avec une réponse positive fournie here. Cependant, c'était pour les versions de jQuery antérieures à 1.9.Google Analytics & jQuery Mobile & jQuery 1.9

S'il vous plaît, quelqu'un peut-il aider à modifier le code afin que l'événement .live déprécié soit remplacé par l'événement .on actuel? J'ai essayé mais sans succès.

Voici le code 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) {} 

});

Source

2013-04-16 MarcelQ

changer juste en temps réel avec le, le résultat final est le même. Ou vous pouvez toujours utiliser l'ancienne méthode bind, contrairement à live cela fonctionne toujours. – Gajotres

@Gajotres 'on' n'est pas un remplacement direct de' live'. La syntaxe d'appel est différente pour les événements délégués. – Walf

Je n'ai jamais dit que c'était un remplacement direct, d'après mon expérience et la documentation officielle sur est actuellement utilisée pour la liaison d'événements de page. Sans oublier qu'il s'agit d'une instruction de méthode live jQuery officielle: À partir de jQuery 1.7, la méthode .live() est obsolète. Utilisez .on() pour attacher des gestionnaires d'événements. Les utilisateurs d'anciennes versions de jQuery devraient utiliser .delegate() de préférence à .live(). – Gajotres

-1

Après avoir fait le .live() à .oN() le changement, je devais aussi déplacer le script de <head> et à la fin de <body>, juste avant la le dernier </div> qui était attaché au <div data-role="page">. Sinon, je n'aurais pas toutes les pages vues.

Source

2013-04-29 00:21:38 JRob

Cela ne se connectera toujours pas correctement aux événements délégués. – Walf

Le code Google donne sur Info suivi page vous ressembler à quelque chose comme ça, selon les fonctions que vous avez choisi:

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); 
    })();

Et vous avez dit de mettre qu'immédiatement après l'ouverture <body>. Vous devez garder au même endroit avec jQuery Mobile (testé sur v1.3) en supprimant la ligne _trackPageview et en ajoutant un extrait simple à la fin de ce bloc de code, ce qui donne:

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) {} 
    });

Source

2013-09-11 08:28:10 Walf

En plus de .live étant remplacé par .on, Google remplace ga.js par analytics.js dans le cadre du passage à Universal Analytics. J'utilisais une variante du code Walf posté pour suivre des pages individuelles sur un site basé sur jQuery Mobile, mais j'avais besoin de le changer pour travailler avec la nouvelle configuration Universal Analytics. Je le script suivant juste après la balise body:

(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) { 
     } 
    }); 
});

Pages Cotée par le hachage de l'emplacement (par exemple #about) dans Google Analytics me donne les informations que je veux voir comment les visiteurs interagissent avec le site.

Source

2014-01-01 11:44:15

Cela fonctionnera uniquement sur les pages qui existent déjà dans le DOM, pas celles qui sont chargées dynamiquement, car vous n'avez pas utilisé d'événement délégué. – Walf

Après la balise body d'ouverture:

<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>

Et dans chaque page:

<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>

Source

2014-03-20 14:25:49

Google Analytics & jQuery Mobile & jQuery 1.9

Répondre

Questions connexes