JSFiddle - React, Tailwind, and code Playground
by Prathameshsb
HTML
<div>
<h1> DEBOUNCE </h1>
<input type="text" class='search'>
</div>
JavaScript
let searchBar = document.querySelector('.search');
function debounce (searchVal, delayTimer) {
let timer;
return function (...args) {
if(timer) clearTimeout(timer);
timer = setTimeout(() => {
searchVal(...args);
}, delayTimer);
}
}
const handleChange = debounce((e) => {
console.log(e.target.value)
}, 1000);
searchBar.addEventListener('onchange', handleChange);