5

I have an input on an HTML page where a person will type something and what I'm wanting is for a function to be called every time they stop typing. I know about the onkeypress event, but that is called every time a character is typed. Here's an example of what I would like:

  1. Person types "this is a test" into the input
  2. After the person stops typing, function foo() should be called
  3. Person types something else into the input
  4. After the person stops typing, function foo() should be called
  5. Repeat....

Is this possible?

Thanks a lot!

Nate
  • 26,164
  • 34
  • 130
  • 214
  • 7
    Define "person stopped typing"... – Oded Jun 23 '12 at 20:42
  • 2
    you can handle mouseup of loss focus event. But not person stop typing – Umesh Aawte Jun 23 '12 at 20:44
  • @Oded - As in they type "this is a test," then stop pressing keys on the keyboard. So there should be maybe a second delay. – Nate Jun 23 '12 at 20:44
  • One second? And if they are thinking? Or gone to another room to lookup stuff? – Oded Jun 23 '12 at 20:45
  • 2
    http://stackoverflow.com/questions/2219924/idiomatic-jquery-delayed-event-only-after-a-short-pause-in-typing-e-g-timew – Rajat Singhal Jun 23 '12 at 20:45
  • You mean something approximating [this](http://stackoverflow.com/questions/693849/call-a-javascript-function-after-5-sec-of-last-key-press)? – dogglebones Jun 23 '12 at 20:46
  • again a repeated question, what I don;t understand is how difficult is to google first..http://stackoverflow.com/questions/2219924/idiomatic-jquery-delayed-event-only-after-a-short-pause-in-typing-e-g-timew – Rajat Singhal Jun 23 '12 at 20:47
  • @RajatSinghal - First of all, that doesn't seem to be exactly the same question. Second of all, how the hell is a noob like me supposed to know to search for "Idiomatic jQuery delayed event"? – Nate Jun 23 '12 at 20:49
  • well it clearly says in title after a short pause in typing..and I think thats what u are trying to ask here.. – Rajat Singhal Jun 23 '12 at 20:51

4 Answers4

11

Listen to onkeyupevent. There start a timeout (you have to define "stop" as some time amount, otherwise it will be called at every keyup), and in the timeout execute your function.

If onkeydown is called while your timer is running, stop it.

Something like...

var timer;

function onKeyUpHandler(e){
    timer = setTimeout("foo()", 500)    
}

function onKeyDownHandler(e) {
    clearTimeout(timer);
}

How this code exactly looks depends where and how you are using it... just to show the way to do it.

User
  • 31,811
  • 40
  • 131
  • 232
  • Ixx - Thanks, this is great, but I can't seem to get it to work: http://jsfiddle.net/j35ba/ – Nate Jun 23 '12 at 21:05
  • ah, the name of the functions is wrong! because the functions calling these have the same names, so they call themseves again until you get stack exceeded error. change the names of the functions. – User Jun 23 '12 at 21:15
  • another thing is that the jsfiddle doesnt seem to declare the content of javascript view before the html, so it doesn't find the functions. try this, it works: http://jsfiddle.net/j35ba/11/ – User Jun 23 '12 at 21:22
0

Just set a javascript timer to start/restart on onKeyPress. Then just define how long defines "stops typing" and run your script.

Minigeek
  • 36
  • 3
0

First, capture the "key up" event, and set a "stoppedTyping" variable to true. Then set a timer (how long you want to wait before considering this a "stopped typing" event).

If, before the timer goes off, you capture a "key down" event, set "stoppedTyping=false"

When the timer goes expires, your timer callback can check the value of "stoppedTyping". If it's true, then the user has stopped typing (or more precisely, has not typed any new chars for the duration of your timer). If it's false, then they have not stopped typing -- they must have typed at least one more char while your timer was running.

cobbzilla
  • 1,920
  • 1
  • 16
  • 17
0

If I understand well, "stop typing" means "no keystrokes for a certain amount of time". In this case, you have to use timers : http://jsfiddle.net/xnghR/1/

Fabien Quatravaux
  • 3,737
  • 2
  • 27
  • 33