<div class="m-4">
<input type="text" placeholder="Search ..." id="search" class="form-control mb-3" />
<p id="content"></p>
</div>
const input = document.getElementById('search');
const content = document.getElementById('content');
input.addEventListener('input', debounce(updateContent));
function debounce(func, delay = 1000) {
let timer = null;
return function(args) {
clearTimeout(timer);
timer = setTimeout(() => {
func.apply(this, args);
// func.call(this, ...args);
// func.bind(this)(...args);
}, delay)
}
}
function updateContent(e) {
content.textContent = e.target.value;
}
This Pen doesn't use any external JavaScript resources.