How to create a timer which starts automatically as soon as a specific webpage is loaded

Question

I want to create a timer which starts automatically as soon as the webpage is loaded and tracks the time I spend on the page before I click on "submit" on that webpage. Is this possible using a tamper monkey script?

I want to track time spent on filling form links.

Possible duplicate of [How to set timer on body onload?](https://stackoverflow.com/questions/21721159/how-to-set-timer-on-body-onload) — George K, May 21 '18 at 14:05
Hi @Hyderabadi and welcome to Stack Overflow. You might have to modify your question a little bit before you can expect users of this site to attempt an answer. I encourage you to take a look at the guidelines for asking questions: https://stackoverflow.com/help/asking. Don't be afraid to ask for guidance in the comments. — snowfrogdev, May 21 '18 at 14:30
Yes, it is possible with a userscript, just find the code that best suits you and add it on a Tampermonkey script — brasofilo, May 26 '18 at 01:28

score 1 · Answer 1 · answered May 21 '18 at 14:17

Set a timer on page load. Than, when submit is clicked just stop the timer.

<script>
window.onload = function() {
  var incrementSecond = function () {
    window.secondsPassed += 1;
    console.log('+1 sec, now we have', window.secondsPassed);
  }

  window.secondsPassed = 0;
  window.myTimer = setInterval(incrementSecond, 1000);
}
var onSubmitClick = function() {
  window.clearInterval(window.myTimer); // always clean resources
  // call some other function to do the submit
}
</script>

<input type="submit" onClick="onSubmitClick"/>

score 1 · Answer 2 · answered May 21 '18 at 14:28

1

You could simply set a new date variable when the page loads and set another when the user clicks submit and find the difference.

<script>
var start;

window.onload = function(){
    start = new Date();
}

function myFunction() {
    var end = new Date();
    var diff = Math.abs(end - start);
    alert(diff);
}
</script>

<button onclick="myFunction()">Submit</button>

answered May 21 '18 at 14:28

Cody D.

49
3

Thank you for your help Cody.It is showing me an alert with Four digit number.May i know how can i get a time instead in seconds or minutes. – Hyderabadi May 21 '18 at 14:33
@Hyderabadi check my post. it might be useful. But if you want use date as source, you can use format fo that class, go check this post https://stackoverflow.com/questions/14638018/current-time-formatting-with-javascript – Bogdan M. May 21 '18 at 14:44
@Hyderabadi, that is the elapsed time in milliseconds. To get seconds, divide the result by 1000. – Cody D. May 21 '18 at 14:56

score 0 · Answer 3 · answered May 21 '18 at 14:07

0

Have a look at this codepen https://codepen.io/shivani137/pen/aYjaKG

setInterval(function() {}, 1000) can help you achive this feature

answered May 21 '18 at 14:07

shivani tiwari

60
5

Thank you for such quick reply and guidance. – Hyderabadi May 21 '18 at 14:13
1

But i have a question how do i use the above code in tamper monkey to run automatically when the web page is loaded and can we display a digital timer instead. Thank you. – Hyderabadi May 21 '18 at 14:15

How to create a timer which starts automatically as soon as a specific webpage is loaded

3 Answers3