2013-06-11 10 views
6

Sto riscontrando problemi nell'utilizzo di mixpanel.track_links con collegamenti aggiunti dinamicamente (dopo il caricamento della pagina).Mixpanel track_links non funziona con elementi aggiunti dinamicamente

Per un esempio generale, data questa pagina:

<div id="link-div"></div> 
<input type="button" id="add-link" /> 
<script type="text/javascript"> 
mixpanel.track_links(".mixpanel-event", "event name", function(ele) { return { "type": $(ele).attr("type")}}); 
</script> 

Ad un certo un'azione da parte dell'utente, i collegamenti si aggiungono alla pagina utilizzando jQuery. Ad esempio:

Il problema è che track_links non viene attivato al clic del collegamento appena creato. Spero che qualcuno possa condividere la loro esperienza nell'abilitare che la funzione track_link funzioni per collegamenti aggiunti dinamicamente.

+3

Il team di supporto Mixpanel confermato che track_links non può essere utilizzato con i link generati dinamicamente. Raccomandano la ricostruzione della funzionalità mediante reverse engineering track_links e track_forms. "Track_links e track_forms sono gestori di clic, la loro struttura di base è che disabilitano il cambio di pagina, inviano la richiesta di traccia, quindi cambiano la pagina sul callback della funzione traccia. C'è anche un timeout (300 ms) per ricaricare la pagina comunque, nel raro caso in cui Mixpanel abbia un'interruzione, il collegamento funziona ancora anche se i nostri server non funzionano. " –

+1

cosa intendi con il reverse engineering di track_links? – Bri6ko

risposta

7

Ero curioso quindi ho controllato il loro codice e sono andato avanti e ho fatto come suggerivano. L'ho provato, e ha funzionato bene. Ciò richiede però jQuery.

Esempio di utilizzo: mixpanel.delegate_links(document.body, 'a', 'clicked link');

// with jQuery and mixpanel 
mixpanel.delegate_links = function (parent, selector, event_name, properties) { 
    properties = properties || {}; 
    parent = parent || document.body; 
    parent = $(parent); 

    parent.on('click', selector, function (event) { 
     var new_tab = event.which === 2 || event.metaKey || event.target.target === '_blank'; 

     properties.url = event.target.href; 

     function callback() { 
      if (new_tab) { 
       return; 
      } 

      window.location = properties.url; 
     } 

     if (!new_tab) { 
      event.preventDefault(); 
      setTimeout(callback, 300); 
     } 

     mixpanel.track(event_name, properties, callback); 
    }); 
}; 
Problemi correlati