Add Delay To Input Change Event – InputtingObserver

Category: Form , Javascript | November 29, 2021
AuthoramaBone
Last UpdateNovember 29, 2021
LicenseMIT
Tags
Views782 views
Add Delay To Input Change Event – InputtingObserver

By default, the change event is fired immediately when a new value has been typed in an input.

The goal of the InputtingObserver JavaScript library is to apply a configurable delay to the change event, which means that the change event will not be triggered until you stop typing for a period of time.

How to use it:

1. Download and include the InputtingObserver JavaScript library on the page.

<script src="inputtingObserver.js"></script>

2. Attach the InputtingObserver to the target input field, where

  • elem: is the dom element to watch
  • changed: is the callback function that will be called after 3s
  • 3000: are the ms to wait
<input id="elemId" />
InputtingObserver(elem, Changed, 3000);
function Changed() {
  alert("input has been changed")
}

You Might Be Interested In:


Leave a Reply