如何使用jquery来计算页面上的操作之间需要多长时间（按钮单击之间的秒表）

Question

我的目标是计算用户浏览一堆页面（单个页面上的隐藏 div）所需的时间，以便我可以记录最好以 mm:ss 或仅 sss 为单位的时间。

我将从一个输入按钮开始，该按钮应该启动计时器，然后单击其中一个隐藏 div 上的另一个按钮，它将停止计时器。

最终目标是在同一页面上有 3 个计时器，并且必须通过 jquery 或 w/e 否则可以用于在单击的 2 个不同按钮之间进行计时。

我知道如何在控制器中完成它，但因为我需要收集 3 次单独的时间，并且不能通过 3 次单独的操作/数据库保存来完成它。

到目前为止，我发现的只是您已经设置了时间，然后它充当倒计时而不是秒表。

任何帮助将不胜感激。

Answer 1

为此，您不需要 jQuery。您可以像这样获取当前自 The-Epoch 以来的毫秒值：

var ms = new Date().getTime();

或者，如果您喜欢字符计数：

var ms = +new Date();

只需执行两次，然后从第二次中减去第一次。唯一可能涉及 jQuery 的地方是挂钩按钮上的点击，例如：

$("selector_for_button").click(function() {
    // ...your code here...
});

Answer 2

$(function () {

    //cache the time when `document.ready` fires and create a variable to track clicks
    var startTime = new Date().getTime(),
        clicks    = [];

    //only bind the `click` event handler to elements with the `my-links` class so we don't track every click on the webpage
    $('.my-links').on('click', function () {

        //push an object onto the tracking array that includes the target of the link and the time when it was clicked
        clicks.push({ time : new Date().getTime(), target : $(this).attr('href') });
    });
});​

这是一个演示： http://jsfiddle.net/wwnyY/1/

然后你可以迭代您保存的点击数组，或将其发送到服务器端脚本以存储以供以后使用。

以下是 Date() 的一些不错的文档：https: //developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Date