Registrera klick med javascipt

För att registrera klick på utgående länkar används ofta redirect-länkar som alltså inte går direkt till målet utan först till en mellan-sida, i denna guide lär vi oss en bättre lösning för detta.

Att registrera klick sker i två delar, första skall javascript finna klicket och sedan skall t.ex PHP, ASP eller ASP.NET spara dessa.
I denna guide går vi endast igenom delen för javascriptet, server side delen kommer ni senar kunna finna på resp. områdes sidor.
En vanlig infallsvinkel är att använda den inbyggda javascript funktionen window.open(), men att med denna öppna fönstret som registrerar klick innebär att 2 fönster öppnas, vilket självklart inte är en stilig lösning på problemet.

Hitta dokumentets länkar

För att inte behöva ladda in javascript för alla länkar och på så vis få onödigt stort dokument vill vi istället söka igenom alla dessa och dynamiskt lägga in vårt javascript kommando.
Genom att anropa funktionen getElementsByTagName() för vårt dokument kan vi genom att välja "a" som argument få alla länkar.

<script type="text/javascript">
var a = document.getElementsByTagName("a");
</script>

Ovan kod lägger in alla "a-taggar", d.v.s länkar i vektor variabeln 'a'.
Nu har vi alltså alla länkar lagrade, men hur gör vi för att lägga in en funktion för registrering av klick i länkarna?
Jo, vi skapar en for-sats som går igenom hela variabeln och lägger till en "onclick" funktion för varje länk, on click är för övrigt en kodsnut som körs vid klick på elementet.

<script type="text/javascript">
var a = document.getElementsByTagName("a");
for(i=0; i<a.length; i++)
	if(a[i].id != '')
		a[i].onclick = rakna_klick;
</script>

Vår ovan kod ser nu till att varje länk vid klickning kör funktionen rakna_klick().

Funktion för klick räkning

Nu har vi kommit en bra bit på vägen, men fortfarande återstår själv funktionen för klick räkning.
För att inte behöva öppna ett nytt fönster med ett server-språk för att registrera klicket så använder vi oss av ett knep, vi laddar nämligen en bild med adressen till våra server-side räknare och som URL parameter skickar vid med ID på länken:

<script type="text/javascript">
function rakna_klick(){
rakna = new Image();
rakna.src = roten+'/rakna.php?id='+this.id;
return true;
}
var a = document.getElementsByTagName("a");
for(i=0; i<a.length; i++)
	if(a[i].id != '')
		a[i].onclick = rakna_klick;
</script>

Vi har nu en fungerande javascript räknare, sidan i PHP som anropas kan bytas ut mot vilket språk som hellst som du vill registrera klicket med.
Vår klickräknare i javascript är nu komplett!


Visa alla våra Javascript guider

---

Kommentarer    Antal 0    Medelpoäng 0/10

Bli medlem för att kunna skriva kommentarer!
Logga in om du redan är medlem.