clearTimeout not working in javascript autocomplete script - javascript

I am using the following code as part of an autocomplete script to avoid hammering the server with every keystroke:
var that = this;
textInput.bind("keyup", function() {
clearTimeout(that.timer);
that.timer = setTimeout (that.doStuff(), 2000);
});
Unfortunately, this does not clear the old timers. They still all execute.
Does anyone know what I'm missing?
Thanks!

You probably want to use:
that.timer = setTimeout (that.doStuff, 2000);
instead of:
that.timer = setTimeout (that.doStuff(), 2000);
Otherwise, doStuff will be called immediately.

Related

cordova setTimeout function

I'm encountering a problem with setTimeout, and I can't figure out why.
I'm using cordova, and the setTimeout function leads to curious comportment.
app.displayData = function(device) {
app.readThermometer(device);
app.readAccelerometer(device);
app.readHumidity(device);
app.readMagnetometer(device);
//setTimeout(app.displayData(device), 5000);
};
This is executed once.
app.displayData = function(device) {
app.readThermometer(device);
app.readAccelerometer(device);
app.readHumidity(device);
app.readMagnetometer(device);
setTimeout(app.displayData(device), 5000);
};
This is executed many times, but way faster than once every 5 seconds. It is a problem for me because it prevent jQuery from executing correctly. (Never getting the dom modification expected)
What am I missing? If it is a bug in cordova, do you know other way to delay code execution in javascript?
You're calling the function app.displayData directly
setTimeout(app.displayData(device), 5000);
Try the following instead
setTimeout(function () {
app.displayData(device);
}, 5000);
And another alternative if you prefer Function.bind
setTimeout(app.displayData.bind(app, device), 5000);

Ending a javascript function

I have an html page that links to a js file that has the following function:
function show360Simple( divContainerId, imageUrl )
The function gets called on an on-click:
<area onclick="show360Simple('pContainer5','images/porch1.jpg');">
And I want to know how to end the function with another on-click:
<div id="close-div" onclick="what is the syntax here to end the above function?"></div>
Its probably simple but I'm a novice and haven't been able to work it out yet - any help is greatly appreciated - cheers.
The script linked above is using setTimeout to manage the animation.
To stop, you will need to modify the code a bit and add a stop function.
The simplest approach would be to store off the timeoutId returned from each setTimeout call. Then, in the stop function, call clearTimeout passing in the stored timeoutId.
Without making too many changes:
// Declare a global timeoutId
var timeoutId;
In function show360 change the setTimeout call to:
timeoutId = setTimeout(…);
In function move360 change the setTimeout call to:
timeoutId = setTimeout(…);
Then add a stop360 function:
function stop360() {
clearTimeout(timeoutId);
}
Demo fiddle
This will stop the animation - basically freezing it. If you want to remove the changes made by the script you could change the stop function to something like this:
function stop360(divContainerId) {
clearTimeout(timeoutId);
if(divContainerId) {
var o = document.getElementById(divContainerId);
o.style.backgroundImage = '';
o.style.position = "";
o.innerHTML = "";
}
}
Demo with Clear

How to add .delay to .click on .each iteration (jquery)

So, I want to put delay on this JavaScript code.
$(function(){
$('.clickThis').each(function(){
$(this).click();
});
});
I tried this
$(function(){
$('.clickThis').each(function(){
$(this).click().delay(5000);
});
});
above script doesnt work .
Is there any alternative?
I've tried Google it but I still couldn't figure it out, because I have little knowledge in JavaScript.
This will do it:
$(function(){
$('.clickThis').each(function(i, that){
setTimeout(function(){
$(that).click();
}, 5000*i );
});
});
Here's a version using a recursive setTimeout loop.
$(function() {
var click = $('.clickThis').toArray();
(function next() {
$(click.shift()).click(); // take (and click) the first entry
if (click.length) { // and if there's more, do it again (later)
setTimeout(next, 5000);
}
})();
});
The advantage of this pattern over setTimeout(..., 5000 * i) or a setInterval call is that only a single timer event is ever queued at once.
In general, repeated calls to setTimeout are better than a single call to setInterval for a few reasons:
setInterval calls can queue up multiple events even if the browser isn't active, which then all fire as quickly as possibly when the browser becomes active again. Calling setTimeout recursively guarantees that the minimum time interval between events is honoured.
With setInterval you have to remember the timer handle so you can clear it
You need to write an asynchronous setTimeout loop, for more information http://www.erichynds.com/javascript/a-recursive-settimeout-pattern/
Try to use this:
$(function () {
var items=$('.clickThis');
var length=items.length;
var i=0;
var clickInterval=setInterval(function(){
items.eq(i).click();
i++;
if(i==length)
clearInterval(clickInterval);
}, 5000);
});
var $clickthis=$(".clickthis");
var i= -1;
var delayed = setInterval(function(){
if (++i < $clickthis.length) $clickthis.eq(i).trigger("click");
else clearInterval(delayed);
}, 5000);
I am not sure but I think that setTimeout function should do the trick.
See here https://developer.mozilla.org/en-US/docs/DOM/window.setTimeout
Try
$(function(){
$('.clickThis').each(function(_,i){
var me=$(this);
setTimeout(function(){me.click()},5000*i);
);
});

Whats wrong with setInterval() and clearInterval() in this javascript function? clearInterval returns undefined

I have the following code:
var focusIntervalObj = setInterval(function(){
focusDelayCaused++;
console.log(focusDelayCaused);
}, 100);
clearInterval(focusIntervalObj);
I am have a firebug installed.
I am expecting this code to log the value of focusDelayCaused.
But when I execute, it doesn't do so, and also the clearInterval() simply returns undefined.
Please guide.
You are setting the interval and clearing it before it fires.
var focusIntervalObj = setInterval(function(){
focusDelayCaused++;
console.log(focusDelayCaused);
clearInterval(focusIntervalObj);
}, 100);
That might be what you are thinking. Which would be simpler as:
var focusIntervalObj = setTimeout(function(){
focusDelayCaused++;
console.log(focusDelayCaused);
}, 100);
Going on the code above, you're immediately clearing an interval just after you've set it. So it never has a chance to run.
Clearing the interval after some sort of condition has been met rather than immediately after setting it would help.
if (focusDelayCaused>50) {
clearInterval(focusIntervalObj);
}
If you want some function be executed once and never again, use setTimeout, in your case:
var focusIntervalObj = setTimeout(function(){
focusDelayCaused++;
console.log(focusDelayCaused);
}, 100);

Call js-function using JQuery timer

Is there anyway to implement a timer for JQuery, eg. every 10 seconds it needs to call a js function.
I tried the following
window.setTimeout(function() {
alert('test');
}, 10000);
but this only executes once and then never again.
You can use this:
window.setInterval(yourfunction, 10000);
function yourfunction() { alert('test'); }
window.setInterval(function() {
alert('test');
}, 10000);
window.setInterval
Calls a function repeatedly, with a
fixed time delay between each call to
that function.
Might want to check out jQuery Timer to manage one or multiple timers.
http://code.google.com/p/jquery-timer/
var timer = $.timer(yourfunction, 10000);
function yourfunction() { alert('test'); }
Then you can control it with:
timer.play();
timer.pause();
timer.toggle();
timer.once();
etc...
setInterval is the function you want. That repeats every x miliseconds.
window.setInterval(function() {
alert('test');
}, 10000);
jQuery 1.4 also includes a .delay( duration, [ queueName ] ) method if you only need it to trigger once and have already started using that version.
$('#foo').slideUp(300).delay(800).fadeIn(400);
http://api.jquery.com/delay/
Ooops....my mistake you were looking for an event to continue triggering. I'll leave this here, someone may find it helpful.
try jQueryTimers, they have great functionality for polling
http://plugins.jquery.com/project/timers
You can use setInterval() method also you can call your setTimeout()
from your custom function for example
function everyTenSec(){
console.log("done");
setTimeout(everyTenSec,10000);
}
everyTenSec();
function run() {
window.setTimeout(
"run()",
1000
);
}

Categories

Resources