Programmiererforum

let debounceTimeout;

function dynamicDebounce(fn, input) {
const delay = Math.min(500 + input.length * 20, 2000);
clearTimeout(debounceTimeout);

debounceTimeout = setTimeout(() => {
fn(input);
}, delay);
}

function handleInputChange(input) {
console.log("User input:", input);
}
document.querySelector('input').addEventListener('input', function(event) {
dynamicDebounce(handleInputChange, event.target.value);
});

Ich möchte eine Funktion in JavaScript mit einer dynamischen Verzögerung basierend auf der Benutzereingabe entprellen. Diese Verzögerung basiert auf der Länge der Eingabezeichenfolge. Je länger die Eingabe, desto länger die Verzögerung.
Mit meinem Code wird die Methode mehrmals ausgelöst oder ist zu stark verzögert:
[code]let debounceTimeout;

function dynamicDebounce(fn, input) {
const delay = Math.min(500 + input.length * 20, 2000);
clearTimeout(debounceTimeout);

debounceTimeout = setTimeout(() => {
fn(input);
}, delay);
}

function handleInputChange(input) {
console.log("User input:", input);
}
document.querySelector('input').addEventListener('input', function(event) {
dynamicDebounce(handleInputChange, event.target.value);
});
[/code]
Wie kann ich das Problem beheben?