JavaScriptのforループ内のsetInterval

Question

以下のコードは、forループ内のsetIntervalに入れる必要があります。私は基本的に、forループの次の繰り返しの間に10秒の休止を入れる必要があります。これは非常に基本的なスクリプトのために、次のものに移動する前に10秒間divのバナーを表示します。既存のsetIntervalは、オプションを使い果たしたときに別のウェブサイトから降りたコードです。どんな助け？そして、私は将来のために知っているように、あなたが私にロジックを説明する気にしない:)

$("document").ready(function() { 

// bannerChange 
function bannerChange(banner,div,milliseconds) { 
    var length = banner.length; 
    for(i=0;i<length;i++) { 
     (function(i) { 
      setInterval(function() { 
       var url = banners[i].url; 
       var img = banners[i].image; 
       $("#"+div).html("<a href='"+url+"' target='_Blank'><img src='www/images/banners/"+img+"' /></a>"); 
      },milliseconds) 
     })(i); 
    } 
} 

function showBanner(bannerName, bannerDiv, milliseconds) { 
    var url = "www/scripts/ajax/getBanners.php"; 
    $.post(url, {name: bannerName}, function(data) { 
     if(data.response == true) { 
      bannerChange(data.banners,bannerDiv,milliseconds); 
     } 
    }); 
} 

// Run banners 
showBanner("Test Banner","test",10000); 
}); 

Answer 1

ここに基づいて更新されたバージョンですコメント：

// Start by getting the banners: 

var banners = []; 
var currentBanner; 

function getBannersFromServer(...) { 
    // TODO: make ajax call to server for banners 

    // push the banners into a queue for later 
    for (var i in bannerFromServer) { 
     banners.push(bannersFromServer[i]); 
    } 
} 

// Then run through them: 

function showNextBanner() { 
    // advance to next banner 
    currentBanner++ 

    // go back to the beginning after the last banner is displayed 
    if(currentBanner >= banners.length) currentBanner = 0; 

    // pull a banner out of the queue 
    var banner = banners[currentBanner]; 

    // TODO: Show the banner in the div 

    // do it again in 10 seconds 
    showNextBanner(); 
} 

// start it all 
getBannersFromServer(); 
getNextBanner(); 

Answer 2

を場合は、使用してみてください：

.delay() 

Here is a great example of this function in use!

Answer 3

この

をお試しください

var i=0;//Global Variable 

function bannerChange(banner, div, milliseconds) { 
    var length = banner.length; 

    setInterval(function() { 
     var url = banners[i].url; 
     var img = banners[i].image; 

     $("#"+div).html("<a href='"+url+"' target='_Blank'><img src='www/images/banners/"+img+"' /></a>"); 

     i++; 
     if(i >= length) i=0;//To reiterate from first 
    },milliseconds);    
} 

これがあなたの問題を解決することを願っています。