Отслеживать кнопку onclick event

Question

У меня есть скрипт, который отслеживает исходящие ссылки, когда ссылка находится внутри тега <a>.

Сценарий из here

Сценарий будет отслеживать HTML внутри тега или изображения.

Что мне нужно для отслеживания кнопки, как показано ниже.

Вот код, я думаю, мне нужно изменить:

function clicktracker(e) 
{ 
var ie = navigator.appName == "Microsoft Internet Explorer"; 
var src = ie ? window.event.srcElement : e.target; 
var tag = (src.tagName.toLowerCase() != "a") ? src.parentNode : src; 

if (!tag || tag.tagName.toLowerCase() != "a") return; 

domain = clicktracker_domain (tag.href); 
extension = clicktracker_extension(tag.href); 

if (clicktracker_inarray(clicktracker_domains, domain) && 
    !clicktracker_inarray(clicktracker_extensions, extension)) return; 

var url = tag.href; 
var title = ''; 

if (!title) if (tag.tagName.toLowerCase() == "a") title = clicktracker_innertxt(tag.innerHTML); 
if (!title) if (tag.tagName.toLowerCase() == "a") title = clicktracker_innertxt(tag.title); 
if (!title) if (src.tagName.toLowerCase() == "img") title = clicktracker_innertxt(src.alt); 
if (!title) if (src.tagName.toLowerCase() == "img") title = clicktracker_innertxt("Image"); 
url = escape(url .substr(0, 150)); 
title = escape(title.substr(0, 150)); 

if (url && title) setTimeout("clicktracker_aux('"+url+"', '"+title+"')", 10); 
return; 
} 

Вот кнопка я хочу, чтобы отслеживать

<button type="button" title="title" style="background:#cda85c;" class="button btn-cart" onclick="window.open('http://www.example.com')"><span><span><?php echo $this->__('Buy Now') ?></span></span></button> 

Вот полный скрипт:

function clicktracker_inarray (arr, val) 
{ 
for (var i in arr) if (arr[i] == val) return true; 
return false; 
} 

// ***** clicktracker_innertxt ***** 

function clicktracker_innertxt(str) 
{ 
str = str.replace(/<[^>]*>/g, ' '); 
str = str.replace( /&amp;/g, '&'); 
str = str.replace(/&nbsp;/g, ' '); 
str = str.replace( /^\s+/g, ''); 
str = str.replace( /\s+$/g, ''); 
return str; 
} 


// ***** URL ******************************************************************* 

var clicktracker_re_scheme = "^\\w+://"; 
var clicktracker_re_folder = "((?:-|\\w|\\.)*)"; 
var clicktracker_re_domain = clicktracker_re_scheme+  clicktracker_re_folder; 
var clicktracker_re_urlall = clicktracker_re_domain+"(?:/"+clicktracker_re_folder+')*'; 

// ***** clicktracker_domain ***** 

function clicktracker_domain(url) 
{ 
var reg = new RegExp(clicktracker_re_domain); 
var match = reg.exec(url); 
if (!match) return ""; 
match = match[match.length-1]; 
return match; 
} 

// ***** clicktracker_extension ***** 

function clicktracker_extension(url) 
{ 
var reg = new RegExp(clicktracker_re_urlall); 
var match = reg.exec(url); 
if (!match) return ""; 
match = match[match.length-1].split("."); 
return (match.length >= 2) ? match[match.length-1] : ""; 
} 


// ***** Track ***************************************************************** 

// ***** clicktracker_aux ***** 

function clicktracker_aux(url, title) 
{ 
var img = new Image(); 
img.src = clicktracker_url+"?url="+url+"&title="+title+"&rand="+Math.random(); 
} 

// ***** clicktracker ***** 

function clicktracker(e) 
{ 
var ie = navigator.appName == "Microsoft Internet Explorer"; 
var src = ie ? window.event.srcElement : e.target; 
var tag = (src.tagName.toLowerCase() != "a") ? src.parentNode : src; 

if (!tag || tag.tagName.toLowerCase() != "a") return; 

domain = clicktracker_domain (tag.href); 
extension = clicktracker_extension(tag.href); 

if (clicktracker_inarray(clicktracker_domains, domain) && 
    !clicktracker_inarray(clicktracker_extensions, extension)) return; 

var url = tag.href; 
var title = ''; 

if (!title) if (tag.tagName.toLowerCase() == "a") title = clicktracker_innertxt(tag.innerHTML); 
if (!title) if (tag.tagName.toLowerCase() == "a") title = clicktracker_innertxt(tag.title); 
if (!title) if (src.tagName.toLowerCase() == "img") title = clicktracker_innertxt(src.alt); 
if (!title) if (src.tagName.toLowerCase() == "img") title = clicktracker_innertxt("Image"); 
url = escape(url .substr(0, 150)); 
title = escape(title.substr(0, 150)); 

if (url && title) setTimeout("clicktracker_aux('"+url+"', '"+title+"')", 10); 
return; 
} 


// ***** Attach Events ********************************************************* 

if (navigator.appName == "Microsoft Internet Explorer") 
    document.attachEvent ('onclick', clicktracker); 
else document.addEventListener('click', clicktracker, false); 

править *****

Клики затем сохраняются в базе данных и вызывается с php-страницы.

Answer 1

Там очень много происходит в этих сценариях, и это не ясно, что вы подразумеваете под «дорожкой», так что я просто дать короткую версию:

document.addEventListener('click',function(e){ 
    var tag=e.target.tagName.toLowerCase(); 
    switch(tag){ 
     case "a": 
      //use e.target to track this link event 
      break; 
     case "img": 
      //use e.target to track this image event 
      break; 
     case "button": 
      //use e.target to track this button event 
      break; 
    } 
}); 

Это прослушивает щелчки в любом месте на странице, и вы используете e.target для проверки щелчка.

Edit:

e только имя, которое я дал на объект события, который автоматически передается в функцию с помощью прослушивателя событий. Одно из свойств, которые всегда находятся в этом объекте, - target, который содержит кучу информации о событии. если вы отпустите console.log(e) внутри функции в прослушивателе событий выше, вы можете потянуть его в Chrome, нажмите control+shift+i, идите в консоль javascript и изучите, что там находится.