CODEWITHSUNDEEP
javascriptjquery
lisovaccaro
lisovaccaro

Reputation: 33996

Show how long has passed since last click?

I want to save the time the user clicks on the page. So I can later return how long ago he clicked with a function.

I think it should basically work like this:

var currentTime = new Date();
var lastClick = currentTime.getTime();
$("body").click(function () {
var lastClick = currentTime.getTime();
    });

function howlong() {
console.log('last click was: ' + currentTime.getTime() - lastClick + 'ms ago');
}

However I Cannot make it work. howlong keeps returning 0. What I am doing wrong?

Upvotes: 1

Views: 2700

Answers (5)

suresh gopal
suresh gopal

Reputation: 3156

Please try this:

<script>
var currentTime = new Date().getTime();
var lastClick = "";
var presentClick = "";
document.onclick=function(e){
 var evt=window.event || e 

 lastClick = currentTime;
 presentClick = new Date().getTime();

 idleTime = parseInt(presentClick) - parseInt(lastClick);
 alert("Last Click = "+lastClick+"\n\nPresent Click = "+presentClick+"\n\nIdle Time = "+idleTime+" ms.");

 currentTime = presentClick;

}
</script>

Upvotes: 0

Anoop
Anoop

Reputation: 23208

Your modified code jsfiddle

var  lastClick ;

$(document).click(function () {
      lastClick = Date.now();
        setTimeout(howlong, 100);//call howlong after 100 ms (this line for testing only). you can call howlong from anywhere in doc to get difference.
    });

function howlong() {
             console.log('last click was: ' +( Date.now() - lastClick ) + 'ms ago');
}​

Upvotes: 1

Matt
Matt

Reputation: 75327

  1. You need to remove the var from within the handler, otherwise you're declaring lastClick again in the local scope, and you're never actually setting the variable you think you are.

  2. A Date instance doesn't update. It's value will always be the time it was constructed at; you'll have to do a new new Date() each time you want a new now.

With both of these taken into consideration, the following should work;

var lastClick;
$("body").click(function () {
    lastClick = (new Date()).getTime();
});

function howlong() {
    console.log('last click was: ' + ((new Date()).getTime() - lastClick) + 'ms ago');
}

Note the potentially WTF extra () around the new Date(). This ensures that a new Date is constructed, and getTime() being called on that, rather than Date().getTime() being called, and then new being called on that (which is wrong!).

You also have to wrap the math - in brackets inside howlong(), to do the math before the string concatenation.

Upvotes: 5

ChaosClown
ChaosClown

Reputation: 367

Use a global var:

    var lastEvent;

    $('selector').bind('event', function() {
            lastEvent = new Date().getTime();  //new Date() is important here
    });

Upvotes: 0

Caspar Kleijne
Caspar Kleijne

Reputation: 21864

lastClick is only valid within the scope of the jQuery function. You need to declare it outside that function

var currentTime = new Date();
var lastClick;
$("body").click(function () {
lastClick = currentTime.getTime();
    });

function howlong() {
console.log('last click was: ' + currentTime.getTime() - lastClick + 'ms ago');
}

Upvotes: 0

Related Questions