Advanced Search

Results 1 to 4 of 4

Thread: setTimeout inside while loop does not function.

  1. #1
    Join Date
    Apr 2009
    Location
    Sydney, Australia
    Posts
    110
    Thanks
    15
    Thanked 1 Time in 1 Post

    Default setTimeout inside while loop does not function.

    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.

    Code:
    <!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??

  2. #2
    Join Date
    Jul 2008
    Posts
    128
    Thanks
    0
    Thanked 17 Times in 16 Posts

    Default

    I may help to read the documentation for those two functions.
    Quote Originally Posted by sniperman View Post
    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.

  3. #3
    Join Date
    Apr 2009
    Location
    Sydney, Australia
    Posts
    110
    Thanks
    15
    Thanked 1 Time in 1 Post

    Default

    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.

    Code:
    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.

  4. #4
    Join Date
    May 2007
    Location
    USA
    Posts
    373
    Thanks
    2
    Thanked 4 Times in 4 Posts

    Default

    Code:
    setTimeout (function () { ... }, 500 * i);
    Trinithis

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •