Calling SetTimeout In A Loop?
Nov 28, 2010<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
[Code].....
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
[Code].....
I have been looking at this code for two evenings now, and rewrote it 4 times already. It started out as jQuery code and now it's just concatenating strings together.
What I'm trying to do: Build a menu/outline using unordered lists from a multidimensional array.
What is happening: Inside the buildMenuHTML function, if I call buildMenuHTML, the for loop only happens once (i.e. only for 'i' having a value of '0'.) If I comment out the call to itself, it goes through the for loop all 3 times, but obviously the submenus are not created.
Here is the test object:
test = [
{
"name" : "Menu 1",
"url" : "menu1.html",
"submenu" : [
[Code].....
'Menu 2' and 'Menu 3' don't show up! I'm sure it's something small that I'm overlooking.
but I just can't figure it out. I have trawled the net for a solution and tried many different things that I have seen but still no luck. Maybe the answer is staring me right in the face and I just can't see it. The code it executing the first time but as the setTimeout tries to start the second loop I get an error 'box is not defined'.
function expand(box) {
var box = document.getElementById(box);
var originalHeight = parseInt(box.style.height);
var inc = 5;
newHeight = (originalHeight + inc);
box.style.height = newHeight + "px";
int = setTimeout('expand(box)',100); }
I've encountered a problem with setTimeout() which I haven't really been able to solve. The problem is that setTimeout works like this:
setTimeout(code, delay) {
// In delay milliseconds, evaluate code
}
Here's the setTimeout I'm trying to use:
setTimeout("result_area.innerHTML += result_string;", delay);
This is nested in a for loop, where result_string changes every time. This raises a problem because what it tries to do is this:
// In delay milliseconds, evaluate "result_area.innerHTML += result_string;"
What I want it to do is the following:
// In delay milliseconds, add whatever result_string is right now to result_area.innerHTML
Unfortunately I can't figure out a way to do this. Does anyone have any answers for me?
i am designing a function that will generate a menu to be used across several websites. the code i have developed goes through all of the motion i want it to, except for one quirk: while in the loop, instead of going through the loop and inserting choice1, choice2, et cetera i want it to insert, in this example, news, profile, et cetera.
this is the call to the function: Code:
why the function "changeDiv(the_div,the_change)" is not called from the for loop in the function displayUsers(keeper)that I generated. The displayUsers is written to get rid of excess code in the function display(keeper).
function changeDiv(the_div,the_change)
{
var the_style = getStyleObject(the_div);
if (the_style != false)
[Code]....
I am calling a program using $.getJSON() inside of a for loop. The problem is that the second callback doesn't wait for the first program to finish before it executes. Is it possible to ensure that the second iteration of the loop doesn't happen until the first one is finished?
$('#dialog-form').dialog({
buttons: {
"Import": function() {
var ids = $("#itemsGrid").jqGrid('getGridParam','selarrrow');
[Code].....
I have the following function that's supposed to say "Please make a guess" 20 seconds after an initial confirmation is displayed. However, it's immediately displayed as soon as someone hits "Cancel". If I change it's time to 40000 (20 seconds after the initial function is called), it does do it 40 seconds total, so it kind of does what I want. So it seems that the second setTimeout is initiated from the time the script is called generally, but I'm looking for a way specifically to have the 20 seconds start only after the "cancel" button is hit.
[code]...
I have a form button with id="submit". When pressed, ClickGeocode(credentials) is called. This works fine and dandy with: $('submit").click(ClickGeocode) Despite there being no indication that the function takes an argument 'credentials'. So when I want to call the function at some point in my code, I should be able to do something like ClickGeocode(credentials) ... no? However, my issue is that credentials isn't once defined in my code - it is part of Bing Maps function... like so:
function ClickGeocode(credentials)
{
map.getCredentials(MakeGeocodeRequest);
}
So why does it work using .click(), and how can I call the function without user interaction (simply somewhere in my code) even if 'credentials' is not defined?
I'm looking to send a loop variable (i) to a function inside the loop, but I can't seem to get it to use the value I want, it keeps making it a reference of i and therefore the function is always called using the last value of i rather than the one it was set with.
So if i have 5 Tabs then Tab 1, when clicked, should call DefaultTabClick(0) and so on rather than always using 4 for any of the tabs.
I have the code below, how could it be modified to loop over and over and reload the xml file each time. Flow would be: load xml, run thruogh code to display each xml node one at a time, when reach last node, start all over, reloading xml file,
[Code]...
As you can see from the code and the output, it will attempt to write to the browser how many moves, but only '0'.
function rollDie()
{
return Math.floor(Math.random() * 6) + 1;
}
/*
*searches for a number in a number array.
*
*function takes two arguments[CODE]...
I'm wondering if its because I don't fully understand setTimeout(). I have a web page that calls a function on the Onload. This function calls two separate functions and then
uses setTimeout() to keep calling itself. Each function randomly generates
a number and then I update the image.src with that.
If I run setTimeout() on just one function by itself, it almost always displays a new pic...but when I put the setTimeout() in the startup function a get a lot of duplicates. I've been watching it for a long time and I don't think it's a coincidence. Any idea
as to why it seems like both functions don't run/update the pic all the time? If I uncomment the line, alert("hello"), it runs all the time? Code:
i'm working on a small idea and i would like to run this code:-
document.getElementById(id).style.height = origheight+"px";
after a set time period (about 20ms i guess ;) ), however, the following line creates errors:-
var t1 = setTimeout("document.getElementById('+id+').style.height = '+origheight+'px' ",0.5);
any ideas why?
I am doing some studying and we was to create a small loop using either the for loop, while loop or do while loop. I chose to do the for loop because it was easier to understand, but I want to know how to do the same using the while loop. Here is the for loop I have, but I cant figure out how to change to while loop.
for (var i = 0; i < 5; ++i)
{
for (var j = i; j < 5; ++j)
{
[Code]....
How do you make the same using a while loop?
it wont loop,as long as you enter something in the name field it will submit. also how do i stop from submitting if all fields are not filled out?
function checkForm(form)
{
var len = form.elements.length;[code]....
<img src=http://xxx.com/yyy.jpg
onmouseover="settimeout("document.location='http://www.google.com'"),
2000">
I want to have a 2 seconds delay before it is directed to an URL when the
mouse is over the image.
However, it seems that setTimtOut does not like parameters in the function
part.
I have a HTML page with a form with 2 buttons like this
....
<input type="button" value="Add" onClick="ClickAdd();"/>
<input type="button" value="Reset" onClick="ClickReset();"/>
....
I also have this javascript code:
----------------------------------------
function ClickAdd() {
setTimeout(test.Add, 100);
//test.Add();
};
function ClickReset() {
setTimeout(test.Add, 100);
//test.Reset();
};
Test = function () {
this.total = 0;
};
Test.prototype.Add = function() {
this.total++;
alert(this);
};
Test.prototype.Reset = function(i) {
this.total = 0;
alert(this);
};
Test.prototype.toString = function() {
return (this.total);
};
test = new Test();
-------------------------------------------
the thing is:
in the ClickAdd function, if i call test.Add() directly, is works ok But if I call it using setTimeout, the /alert(this)/ shows [object Window]....
Does anyone know whether the ECMA, or an other standard document,
specifies a maximum for the value that can be pass to the setTimeOut()
function in Javascript?
The below pasted code is my attempt to get the text of a span to change
every second. However, it seems to just set the text of the span to be the last item
in the array. Code:
I am modifying the suckerfish dropdown code to use settimeout to have
a slight pause before the menus disappear to make it more user
friendly. I have hit a snag with the following statement:
li.
{
timerID=setTimeout('this.getElementsByTagName("UL")
[0].style.display = "none"', timecount);
}
If I put take the statement
this.getElementsByTagName("UL")[0].style.display = "none";
out of the settimeout function, it works. (w/o the pause, obviously).
With the settimeout function, I get "this.getElementByTagName is not a
function" error.
I have tried putting this.getElementsByTagName("UL")[0] is a variable
and then using that in the settimeout function, but then each li will
only open the very last menu in the list. (ie all the menu items open
the last sub menu) Code:
Can I have two setTimeouts running at the same time - with two
different intervals?
I want to start one timer and, before it times out, start another one
I've tried this and they seems to interfer with one another.
var SessionTimer;
function StartSessionTimer()
{
SessionTimer = setTimeout('RedirectToSessionTimedOutPage(),60000)
}
function RestartSessionTimer()
{
clearTimeout(SessionTimer);
StartSessionTimer();
}
function RedirectToSessionTimedOutPage()
{
window.location = '/SessionTimedOut.html'
}
When I load the page and call StartSessionTimer(), I know it works because the page redirects after ten minutes (the value of 60000). However, in certain situations I need to be able to call back to the server with AJAX and then have the timer reset - that's when I call the RestartSessionTimer() function. When I do this, for some reason the ten minute window does not get reset.
To troubleshoot, if I remove the second line in the RestartSessionTimer() function the redirect is getting blocked (as planned). However, when I put the second line back in, the page just redirects as originally called - the SessionTimeout value is never
reset properly.
The code above looks good to me, but for some reason the SessionTimeout var does not get reset in the RestartSessionTimer function; it retains its original value?
I have a pop-up menu; one of those where you scroll over the menu, and
a submenu pops up beneath it. Everything's running smoothly on every
browser I've tested with, except for one problem on every browser: the
"clearing" of the menu.
The menu itself is being called by:
onMouseOver="menu(1)" onMouseOut="clearIt()"
function menu(x) let's "x" refer to a predefined array, which
determines which menu to pop up. That menu is stored in a variable,
showMenu. If x==0, then it changes showMenu to a whitespace, thus
"clearing" the submenu altogether.
clearIt() is a simple function, pasted here:
function clearIt() { setTimeout("menu(Ɔ')", 7000) }
The idea is that the menu will disappear after 7 seconds. The problem
I'm having, though, is that the 7 seconds starts after the first
onMouseOut, and doesn't restart when the visitor mouses over the
second button. So, if I look at the first submenu for 6 seconds, then
when I go to the second button the menu only stays open for 1 second,
instead of starting the timer over.
Here we are again pondering why setTimeout will not work, or rather mucks things up. This will work. addOn(obj);
function addOn (obj)
{
var parentNode = obj.parentNode;
var span = parentNode.getElementsByTagName("span")[0];
span.style.display="block";
thkOn(obj);
[Code]...
function funt()
{
var link = document.getElementsByClassName("class")[0];
[code]....