JS不會循環，在第一個循環後停止

-1

我已經編寫了下面的代碼，用作客戶端網站標題中的簡單幻燈片。現在，唯一的問題是，當我把它放到一個for或者while循環中時，它會到達第一個循環的末尾，然後停下來。我試過在最後一次回調中調用togglinga（），我嘗試過，在for和while循環中包裝整個事物，我試過創建一個不同的函數，調用這個函數，然後使用該函數在最後回調中使用相同的函數名稱，但每次都會得到相同的結果。我會很感激的人都把目光掠過這個，看看他們是否能看到什麼我不能....JS不會循環，在第一個循環後停止

function triggerAnimation(){ 
     $("#logoareacontainer").delay(15000).fadeOut(3000, function() { 
      $("#title-1").fadeIn(0).delay(0, function() { 
       $("#cdsl-1-1").fadeIn(1000).delay(2000).fadeOut(0, function(){ 
        $("#cdsl-1-2").fadeIn(0).delay(2000).fadeOut(0, function(){ 
         $("#logoareacontainer").fadeIn(1000).css({display:'block'}) 
        }) 
       }) 
      }) 
     }) 
    }

來源

2013-08-31 UNB

使用https://github.com/caolan/async。看'並行'和'系列'函數 –

+12

** 1。**您正在使用jQuery，而不是普通的vanilla JavaScript。 ** 2。**發佈的代碼中沒有任何循環。 ** 3 **這段代碼的外觀雖然美觀，但應該引發一種感覺 - 要實現這一點，必須採取更明智的方式。對於初學者，我會使用Google'jQuery幻燈片插件'; – funkwurm

您應該考慮重寫此代碼以獲得一個配置數組對象，詳細說明哪些元素會淡入/淡出以及延遲多長時間，然後執行遞歸setTimeout函數會讓你的生活更容易 –

更短，如果你打破成可以以循環方式調用的函數更容易些。

請注意，.delay()不接受回調函數，這是該問題的重要組成部分。

這裏有一個演示：http://jsfiddle.net/kjaHZ/

// for each "title-", keep track of how many "cdsl-"s there are 
var titles = [null, 4, 2, 2, 2, 1, 1]; 

start(); 

// start it off 
function start() { 
    $("#logoareacontainer").delay(1500).fadeOut(3000, function() { 
     doTitle(1); 
    }); 
}

// this starts a "title-" section 
function doTitle(i) { 
    if (i < titles.length) { 
     // do the "title-" for the given "i" variable 
     $("#title-" + i).fadeIn(0, function() { 
      // after fading in, do the "cdsl-" ids 
      doCDSL(i, 1); 
     }); 
    } else { 
     // or if "i" is >= titles.length, we're done 
     $("#logoareacontainer").fadeIn(1000).css({display:'block'}); 
    } 
}

// this starts a "cdsl-" section 
function doCDSL(i, j) { 
    $("#cdsl-" + i + "-" + j).fadeIn(1000) 
    .delay(2000) 
    .fadeOut(0, function() { 
     if (j < titles[i]) { 
      // move to the next "cdsl-" 
      doCDSL(i, j+1); 
     } else { 
      // or do the next "title-" 
      $("#title-" + i).fadeOut(1000).css({display:'none'}) 
      doTitle(i+1); 
     } 
    }) 
}

來源

2013-08-31 19:44:27 user2736012

你不能把代碼在一個循環中，因爲它是異步的。循環只會立即啓動所有動畫，因爲最外層的調用不會等到所有動畫完成爲止。

在最內層，只需撥打triggerAnimation即可重新啓動。

來源

2013-08-31 19:03:04 Guffa

雖然你的代碼是非常awfull這裏妳:)ü錯過()

function togglinga(){ triggerAnimation(); };

來源

2013-08-31 19:05:11 dscdsc

JS不會循環，在第一個循環後停止

回答

相關問題