首页 > 编程语言> 文章详细

javascript – 跟踪按钮点击次数

2019-06-28 23:22:27 阅读：241 来源： 互联网

标签：jquery javascript back google-analytics html5-history

作为新产品指标的一部分,我们需要衡量页面上的后退按钮点击次数.

由于该站点不是AJAX而且我们在“pushState”中没有使用,因此在浏览器中单击返回时不会触发“popState”.

捕获后退按钮事件的唯一目的是注册分析事件.

谷歌搜索了几个小时后,尝试了几种不同的解决方案,我出现了空洞 – 奇怪的是,javascript似乎没有配备这样的任务.

话虽如此,这不是一个有效的回答:)你会如何处理这样的要求？

请注意 – 获得赏金的答案并未解决我的问题,但由于努力,我已经给予了赏金.在这种情况下,这是最好的答案

解决方法:

您可以捕获window.onbeforeunload()并使用cookie来存储每个后退按钮点击的后退按钮点击次数,您可以更新cookie.试试吧.

使用您可以实现的popstate和cookies
我使用了一个名为cookie的插件

并将它们导入您的页面.

这是导入.

<script src="/jqueries/jquery.cookie.js"></script>

这是我使用的代码.

$(window).on('popstate', function () {
    var val = 1;
    if (typeof $.cookie('example') === 'undefined') {
        //no cookie
    } else {
        //have cookie
        val = parseInt($.cookie("example")) + 1;
        $.removeCookie("example");
    }
    $.cookie("example", val, { expires: 7 });
    //alert($.cookie("example"));
});

它的juzz是一个粗略的代码你可以把它做成你想要的它将创建pushstate

将其添加到脚本中..

HTML中只有DEMO内容

<input type="text" id="t1" />
<input type="text" id="t2" />
<input type="text" id="t3" />
<input type="text" id="t4" />
<input type="text" id="t5" />

这些是没有AJAXify的HTML5 pushstate脚本.试试这些……

    $('#t1').click(function () {
        if (window.history.replaceState) {
            window.history.pushState('', 'Title', '/YourPagename/123/1234');
        }
    });
    $('#t2').click(function () {
        if (window.history.replaceState) {
            window.history.pushState('', 'Title', '/YourPagename/123/12345');
        }
    });
    $('#t3').click(function () {
        if (window.history.replaceState) {
            window.history.pushState('', 'Title', '/YourPagename/123/123456');
        }
    });

等等.为其他人声明这些

通过这种方式是可能的.

这部分是为了获取传递的url值,这里t1,t2将获得与url相关的值

var ourl = "", t1 = "", t2 = "";
if (window.history.replaceState) {
    ourl = document.URL.toString();
    var url = document.URL.toString().replace('http://', '');
    var cnt = 0;
    for (i = 0; i < url.length; i++) {
        if (url[i] == '/') {
            cnt++;
        }
        else if (cnt == 2) {
            t1 += url[i];
        }
        else if (cnt == 3) {
            t2 += url[i];
        }
    }
}

标签：jquery,javascript,back,google-analytics,html5-history
来源： https://codeday.me/bug/20190628/1320713.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript – 跟踪按钮点击次数