2014-09-22 28 views
-1

我想要一个用户点击某个元素(使用clk类)在我的网站中加载跟踪像素。仅对每个访问者点击一次的跟踪像素加载(每个访问者点击)

我几乎没有任何jQuery的知识,所以我想出了这个代码:

$(".clk").click(function(){ 
    $('<img src="/images/track.gif" width="1" height="1">').appendTo("body"); 
    }); 

首先,足够好了吗? (有没有机会浏览器预先载入图像?当然我不想)

其次,我只需要获取第一次点击的信息就足够了。我不想跟踪来自同一访问者的那个元素的任何额外点击(不是通过IP) - 我想我想每个会话都这样做,这意味着如果窗口关闭了?还是应该关闭整个浏览器?) 。

我应该添加到代码中以使其以这种方式工作?

+0

第一,的jsfiddle将使它更容易为我们解答。 其次,我会做$(“”).attr(“src”,...)。 – Linial 2014-09-22 21:50:33

+1

jsfiddle如何帮助这里?该脚本本身正在工作,我只是寻找其他建议或意见 – rockyraw 2014-09-22 21:52:10

+0

为什么这会更好?没有必要定义尺寸? – rockyraw 2014-09-22 21:55:01

回答

0

浏览器有时会扫描JS并查找URLS。你可以很容易地改变它是更多的东西一样:

var loaded = false; 
$(".clk").click(function(){ 
    if(loaded === false) { 
     loaded = true; 
     $('<img src="/images/track.gif?param=' + Date.now() + '" width="1" height="1" />').appendTo("body"); 
    } 
}); 

这应该解决这两个浏览器预加载和“有它已经被点击”的问题。您可能能够删除URL中的查询参数,但如果浏览器执行了像这样的URL的预提取或caxginh,我会感到非常惊讶。

+0

它是如何解决它是否被点击?如果用户打开页面,点击,然后再次点击,图片将不会被加载?如果他点击,关闭窗口,然后再次进入,它会被加载?以及如果他完全关闭浏览器然后重新进入呢? – rockyraw 2014-09-22 21:53:56

+0

那么,你在原来的问题中没有说清楚你想让它记住点击刷新,浏览器关闭等。我已经更新了我的答案。你也可以使用cookies,但是新的,cookies。 – 2014-09-22 22:00:37

+0

谢谢,你能解释一下更新代码和前者之间的区别吗?每个人对于“记住”用户的方式做了什么? – rockyraw 2014-09-22 22:03:32

0

我认为@Jessie A. Morris的例子是相当不错的,但要确定浏览器不会缓存跟踪图像我会亲自使用一些更随机的字符串(unix时间可以是一个很好的开始)。

另一件事是 - 我们是不是要跟踪每个会话或每个浏览器/ pc/...用户?

使用一些饼干& & HTML5的localStorage然后将(有jQuery的许多插件)是恰当的...

+0

我想我会按照每个会话去,我不认为我想为此使用cookie。所以一旦页面被刷新,我认为它会被认为是一个新的会话? – rockyraw 2014-09-22 22:05:46

+0

Hehe,@Jessie A. Morris你的下一个解决方案正是我所评论的:)也许向它添加AJAX(禁用缓存)也将是一个很好的接触,JQuery使我们更容易... – nettutvikler 2014-09-22 22:05:57

+0

刷新页面的新会话 - 我认为这只是相同的会话延长(取决于服务器端,如果在会话超时前发生刷新(PHP有默认20分钟)) – nettutvikler 2014-09-22 22:08:01