爲什麼它在我的if/else語句中循環遍歷'else'？

Question

如果在我的if/else語句的底部啓用alert(rand)，您會注意到，在運行時，它會不斷循環if/else語句的else部分。這可能是一個簡單的修復，但我似乎無法弄清楚。我曾經在開發的早期階段工作，但現在似乎無法解決問題。

我會發佈下面的代碼，但它可能更容易看看我的jsfiddle，在這裏：http://jsfiddle.net/zAPsY/7/謝謝。

$(document).ready(function(){ 
//You can edit the following file paths to change images in selection 
var img1 = '<img src="images/luke.jpg">'; 
var img2 = '<img src="images/luke.jpg">'; 
var img3 = '<img src="images/luke.jpg">'; 
var img4 = '<img src="images/luke.jpg">'; 
var img5 = '<img src="images/luke.jpg">'; 
var img6 = '<img src="images/luke.jpg">'; 
var all = img1 + img2 + img3 + img4 + img5 + img6; 

//Rotation 
var speed = 0.00; 
var radius = 80; 
var count = 0; 

$("#run").bind("click",runButtonClick); 

function rotate() 
{ 
    var centerx = $(document).width()/2; 
    var centery = $(document).height()/2;   
    var num_items = $("#container > img").length;  
    $("#container > img").each(function(){ 
     var angle = count * (Math.PI/180);    
     var newx = centerx + Math.cos(angle)*radius - $(this).width()/2;     
     var newy = centery + Math.sin(angle)*radius - $(this).height()/2;    
     $(this).css("left",newx+"px").css("top",newy+"px");    
     count += 360/num_items + speed; 
    }); 
} 
setInterval(rotate,100/1000); 

//Append elements to container 
$("#appendall").click(function(){$('#container').append(all);}); 
$('#append').children().eq(2).click(function(){$('#container').append(img1);}); 
$('#append').children().eq(3).click(function(){$('#container').append(img2);}); 
$('#append').children().eq(4).click(function(){$('#container').append(img3);}); 
$('#append').children().eq(5).click(function(){$('#container').append(img4);}); 
$('#append').children().eq(6).click(function(){$('#container').append(img5);}); 
$('#append').children().eq(7).click(function(){$('#container').append(img6);}); 

//Refresh page 
$("#reset").click(function(){location.reload();}); 

//IF speed is greater than 0 - ELSE add animation to div element 
function runButtonClick() { 
    var maxcount = 0.40; 
    var incdec = 0.01; 
    setInterval(function(){counter();}, 100);  
    counter() 
    speed; 
    function counter() 
    { 
     if (maxcount >= 0.00) 
      { 
       maxcount = maxcount - incdec; 
       speed = speed + incdec; 
       //alert(speed) 
       //alert(maxcount) 
      }    
     else if (maxcount <= 0.00) 
      { 
       speed = 0.00; 
       //Find amount of div elements and add 1 
       var brewees = $('#container').children().length +=1; 
       //get a random number 
       var rand = (Math.floor(Math.random()*brewees)); 
       var ap = '20px'; 
       var ab = '#ddd'; 
       var ad = 1000; 
       //match random number corrosponding child in div 
       $('#container').children().eq(parseFloat(rand)) 
       .animate({padding: ap, background : ab}, {duration:ad}); 
       alert(rand); 
      } 
    } 
} 

}）;

Answer 1

你讓你的maxcount下降到零以下，但你的功能每100ms仍然被調用（由於你的setInterval）。

所以，你應該最終清除間隔做：

/* first */ 
var intervalID = setInterval(function(){counter();}, 100); 

/* later */ 
clearInterval(intervalID); 

Answer 2

您正在以每秒10次的速度調用函數（setInterval）。最終，maxcount變量將降至0以下，導致執行else條件。

你應該存儲在一個變量區間通話，並使用clearInterval在別人，使功能else後只運行一次：

//Store a reference to the interval 
var interval = setInterval(function(){counter();}, 100); 
... 
function counter(){ 
    ... 
    else if(..){ 
     ... 
     clearInterval(interval); //Clear the previously defined interval 
    } 
... 

另注：在代碼中，speed;已經沒有用了。可以用var（var speed;）作爲其前綴，也可以將其刪除。