I have similar requirement like jquery-run-code-2-seconds-after-last-keypress.
Now, when I use @brad
code, it works fine when i do :-
$('input.username').keypress(debounce(function (event) {
console.log('Search keypress');
}, 250));
But not when :-
$('#search').keypress(function () {
debounce(function (event) {
console.log('Search keypress');
}, 2000);
});
Fiddle here. Any help would be really appretiated.
Edit:-
Initially I was doing something like below, which is not what I want-
$('#search').keypress(function () {
setTimeout(function () {
console.log('Search keypress');
}, 3000);
});
Edit 2:- I want something very similar to below:- (Copied text from there )
At the moment after 3 characters are entered it will search on every key press.
What I want is
Case1:
User enters tes
2 seconds pass search performed
Case2:
User enters tes
1 second pass
user presses t
2 seconds pass
search is performed on test
Case3:
User enters tes
1 second passes
user presses t
1.5 seconds pass
user presses i
1.5 seconds pass
user presses n
1.5 seconds pass
user presses g
2 seconds pass
search in performed on testing
so as you can see, the search action is only performed when there has been no key presses(or pastes ect) in the two seconds following a key press.
my basic idea is to.
on keydown Call a function that sets a timeout, the function also sets a variable containing the last entry in the textbox. when the timeout expires it checks the value in the box to see if it matches the value in the variable.
To debounce it using timeout:
{ BTW, use keyup event instead of keypress, delete key doesn't fire keypress event, see: http://www.quirksmode.org/js/keys.html }
var timer;
$('#search').keyup(function () {
clearTimeout(timer);
timer = setTimeout(function (event) {
console.log('Search keypress');
var text = $('#search').val();
$('#textTobeSearched').text(text);
}, 2000);
});