[JQUERY] KeyDown wykonywanie funkcji w odstepie czasowym.

0

Witam, mam pytanie,
oto mój skrypt.

var pasek=0;
$('#pas').keydown(function(){
	
pasek++;
$('#pasek').html(pasek);
});

Teraz podczas trzymania przycisku zmienna zwieksza sie w niekontrolowanym tempie, chcialbym kontrolowac szybkosc z jaka powtarza sie zwiekszenie zmiennej.
Pozdrawiam.

0

na keydown dodaj Interval o pożądanym odstępie czasu, który bedzie wykonywał twoją funkcję. Na keyup go czyść.

0

Są terminy określające to co chcesz zrobić. W tym wypadku dwa:

Throtttle

Throttling enforces a maximum number of times a function can be called over time. As in "execute this function at most once every 100 milliseconds."

Say under normal circumstances you would call this function 1,000 times over 10 seconds. If you throttle it to only once per 100 milliseconds, it would only execute that function at most 100 times

(10s * 1,000) = 10,000ms
10,000ms / 100ms throttling = 100 maximum calls

Debounce

Debouncing enforces that a function not be called again until a certain amount of time has passed without it being called. As in "execute this function only if 100 milliseconds have passed without it being called."

Perhaps a function is called 1,000 times in a quick burst, dispersed over 3 seconds, then stops being called. If you have debounced it at 100 milliseconds, the function will only fire once, at 3.1 seconds, once the burst is over. Each time the function is called during the burst it resets the debouncing timer.

The Difference Between Throttling and Debouncing

Implementacja dla jQuery z użyciem https://github.com/cowboy/jquery-throttle-debounce

var greet = function () {
    console.log('Hello!');
};

// debounce to tzw. dekorator, czyli dekoruje twój handler dodając mu nową funkcjonalność
var debouncedGreet = $.debounce(greet, 5000);

$('#myButton').click(debouncedGreet);
0

Szukałem po roznych forach roznych niestety zadno rozwiazanie implementacji debounce nie działa.
Oto mój kod:

		var funk = function(){
    alert('Działa!');
};
 

var debouncedFunk = $.debounce(funk, 5000);
 
$('#pas').click(debouncedFunk );

odziwo w momencie pominiecia debounced :

		var funk = function(){
    alert('Działa!');
};
 
$('#pas').click(funk );

wszystko działa jak powinno. Ma ktoś jakies pomysly?

Edit

Zastosowalem rozwiazanie z javascript

	zmienna = 0;
 var timer;
 $('#pas').keydown(function() {
     //Called every time #myButton is clicked         
     if(timer) clearTimeout(timer);
     timer = setTimeout(process, 2000);
 });

function process(){
zmienna++;
$('#wykaz').html(zmienna);
}

jednak to rozwiazanie zwieksza zmienna dopiero po puszczeniu przycisku co troche mija sie z celem, chodzi mi o to by co dana ilosc czasu podczas trzymania przycisku zmienna byla zwiekszana.
Pozdrawiam.

0

Zamieszałem z tym przykładem wyżej, powinieneś użyc w tym wypadku throttle: JSFiddle

0

Dzieki wielkie, pomogło.
Mam jeszcze jedno pytanie, jak wyglada kod który po puszczeniu przycisku automatycznie zmniejsza liczbe z taka sama predkoscia co przy trzymaniu dodaje?
Pozdrawiam.

1 użytkowników online, w tym zalogowanych: 0, gości: 1