在页面的一部分上花费的时间

Time spent in a part of a page

本文关键字:时间 一部分      更新时间:2023-09-26

我有一个包含几个部分的页面。我正在使用以下导航菜单 jsfiddle我想计算用户阅读页面部分所花费的时间。这个想法是在激活部分更改时触发事件并设置计时器,如果计时器大于 5 秒(例如)用户正在读取一个部分,那么我发送一个 ajax 请求以节省读取给定部分所花费的时间。

 TrackUserReading(function () { 
                    var sectionName = $("nav ul#sidebar.nav li.active a").html();
                    url = '/Main/TrackUserReading';
                    data = { sectionName: sectionName, time : Timer };
                    var dataType = "json";
                    if(sectionName)
                         $.post(url, data, $.proxy(function (data, textStatus, jqXHR) {
                    }, this), dataType);

但是,如果用户停留在同一部分中并且他打开一个新选项卡,在这种情况下计时器不正确怎么办。

我的问题是,以良好的准确性计算用户花费的时间的最佳方法是什么。提前谢谢。

在chrome和Firefox中,setTimeout设置为在选项卡处于非活动状态时每秒触发一次

要检查选项卡是否处于活动状态,请从此处借用答案:

var interval_id;
$(window).focus(function() {
    if (!interval_id)
        interval_id = setInterval(trackUserReading, 1000);
});
$(window).blur(function() {
    clearInterval(interval_id);
    interval_id = 0;
});
当选项卡聚焦时,

您可以执行函数,当选项卡处于非活动状态时,它会删除间隔并停止执行函数。

HTML5 Page Visibility API旨在解决这个问题,现在几乎在任何地方都得到支持。