跟踪按钮onclick事件

时间:2015-12-15 16:43:38

标签: javascript tracking

我有一个脚本可以在链接位于<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页面调用。

1 个答案:

答案 0 :(得分:0)

这些剧本中有很多事情发生了,并且不清楚你的意思是什么?跟踪&#34;所以我只是给出一个简短的版本:

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来检查点击。

编辑:

e只是我给事件对象的名称,它由事件侦听器自动传递给函数。此对象中始终包含的一个属性是target,其中包含有关该事件的大量信息。如果您将console.log(e)放在上面事件监听器中的函数内,则可以在Chrome中将其拉出,点击control+shift+i,转到javascript控制台,然后浏览其中的内容。