Looping and pausing after loading ajax content in Javascript JQuery
- by Tristan
I have what I though was a simple problem to solve (never is!) I'm trying to loop through a list of URL's in a javascript array I have made, load the first one, wait X seconds, then load the second, and continue until I start again.
I got the array and looping working, trouble is, however I try and implement a "wait" using setInterval or similar, I have a structural issue, as the loop continues in the background.
I tried to code it like this:
$(document).ready(function(){
// my array of URL's
var urlArray = new Array();
urlArray[0] = "urlOne";
urlArray[1] = "urlTwo";
urlArray[2] = "urlThree";
// my looping logic that continues to execute (problem starts here)
while (true) {
for (var i = 0; i < urlArray.length; i++) {
$('#load').load(urlArray[i], function(){
// now ideally I want it to wait here for X seconds after loading that URL and then start the loop again, but javascript doesn't seem to work this way, and I'm not sure how to structure it to get the same effect
});
}
}
});