Log in

View Full Version : setTimeout inside while loop does not function.


sniperman
09-19-2009, 05:32 AM
Ok, this one is for the hardcore "best practices" scripters who can increase the wider communities learning curve.

The basic problem is that a setTimeout() or setInterval() inside a while loop does not work. The delay is not respected. I have read on many other forums that javascript while loops ignore setTimeout().

The code below is supposed to move an image up the screen by increments of 3 pixels on a delay of 500 milliseconds per iteration. My setTimeout() calls a dummy function like i=i; to best emulate a delay function.


<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<script type="text/javascript">
/*<![CDATA[*/

fieldSector = new Array() //
fieldSector[0] = "0,0,60,66";
fieldSector[1] = "60,0,120,66";
fieldSector[2] = "120,0,180,66";
fieldSector[3] = "180,0,240,66";

function trackObj() {
var playerID = 'player1'; // array 1 value
if (sector <= 2) {
var direction = "south";
} else {
var direction ="north";
}
var distance = 200;
var action="go";

while (action=="go") {
var em = document.getElementById(playerID);
var running = parseInt(em.style.top); // gets the xposition location of player as a number

if (direction=="north")
{
if (distance>=0)
{
running+=-3; // travel X pixels distance
distance=distance-3; // remove x pixels from distance
em.style.top=running+"px"; // runs extra distance
setInterval("argumentHere()", 500); // small motion delay
} else
{
action="stop"; //end while loop
return
}
}
}
}
/*]]>*/
</script>

<title>timeout and while loop </title>

</head>

<body>
<img id="player1" src="somewhere.gif" />

</body>
</html>

I would rather not wrap this whole loop inside a function. Then I would have to pass many parameters, which is not cool. Does anyone have a solid solution??
clueful
09-19-2009, 02:06 PM
I may help to read the documentation for those two functions.
The basic problem is that a setTimeout() or setInterval() inside a while loop does not work.Yes it does.
I have read on many other forums that javascript while loops ignore setTimeout().Loops don't ignore anything.
The code below is supposed to move an image up the screen by increments of 3 pixels on a delay of 500 milliseconds per iteration.
Code your animation as a function then call it via single external call to setInterval.
sniperman
09-20-2009, 06:36 AM
Thanks, I already found a solution.

I now understand that the setInterval() method works when used in a loop. However, the while loop DOES NOT stop for the process in the setInterval method, nor does it stop for the interval delay.

So the while loop iterates 100 or 1000 times over (depending on processor speed and until the while loop is satisfied) before the delay kicks in. This defeats the purpose of using an artificial delay.


timer = setInterval(function(){sectorRun(action)}, 20);

So i placed the whole code in a function and ran the function from the setInterval() method. This worked very well. I just don't like passing arguments/parameters to other functions. I had to recode the thing... meh.
Trinithis
09-20-2009, 08:00 AM
setTimeout (function () { ... }, 500 * i);