OMBD#14: How To Call a Function When a User Stops Typing

We’ll learn how to implement a browser auto-saving draft system in JavaScript

Welcome to issue #14 of One Minute Better Developer, where you become a more successful software developer by reading short nuggets of knowledge, one minute at a time.

⏮️ 🔛 ⏭️

Art by my buddy Loor Nicolas

THE PROBLEM

We are implementing a text editor with a Google-Docs-like draft system, where content gets saved server-side when the user stops typing for a second.

A SOLUTION

We are going to use the keyup event and window.setTimeout .

The key to this snippet is that the timerId has to be set declared in the scope of the keyup callback, in order to be reassigned to the new timeout id every time the keyup callback is fired again.

Here’s a demo on CodePen:

Call function when the user stops typing.

If you liked this story, you may also like:

1 Minute To Become A Better Developer (#12)

1 Minute To Become A Better Developer (#18)

⏮️ 🔛 ⏭️