1

I want to make a js timer that starts when typing is detected in a certain html input box. The timer does not need to be displayed on the webpage, or need to be in js. Preferably it should record in seconds.

Edit

I seem to have forgotten to ask the question. The question is how do I make the timer?

Thanks, David

10
  • So you better get to work then... what is the question exactly?
    – user7869
    Aug 5 '15 at 4:37
  • @user7869 Mindblown
    – i_am_david
    Aug 5 '15 at 4:43
  • Do you want to keep track of the seconds? or just trigger an event after a specific time?
    – wallek876
    Aug 5 '15 at 7:43
  • The basic logic is set the time "now" to a variable. Then set another time "now" when the user finished typing. And compare the difference. You can understand more on it via the manual: developer.mozilla.org/en/docs/Web/JavaScript/Reference/…
    – user7869
    Aug 5 '15 at 18:37
  • @wallek876 Currently undecided, either one works.
    – i_am_david
    Aug 6 '15 at 1:08
1

First you need to think about time past.

A common logical way to do this is as so:

1) User presses a key - set time of "now" to a variable lets say "start".
2) User stops typing  - compare "now" to "start" to get time passed.

You can use something like this for time: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getTime

So how do we detect a user pressed a key:

Now for typing you can use something called an event listener.

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

The idea of an event listener is it listens to actions a user does and then calls a specified function. There are lots of events pre-made in javascript in the documentation but i'll save you the trouble of googling, here is the complete list of events you can use:

https://developer.mozilla.org/en-US/docs/Web/Events

Hint: keypress, keydown and keyup might be of interest to you here.

But every letter the user types will involve a keydown and keyup and a keypress. So to signify the "end" of the user typing his or her sentence you might want ot listen to a specific button on the keyboard - perhaps the enter key. Once that button is pressed then you compare the time elapsed as enter key would signify the end of the input.

So once you set up the listeners to listen for specific actions from the user - you will want that event listener to call a function that compares time elapsed using basic mathematics of your two time stamps, then print that time elapsed on screen.

1
  • Haha I doubled your rating
    – i_am_david
    Aug 8 '15 at 5:15

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .