變量內部重複函數保留舊值

我是Jquery的新手，我似乎無法找到造成此問題的原因。變量內部重複函數保留舊值

我有一個變量，每次運行GameStart（）函數時都會得到一個新值，我試圖在暫停函數中創建一個暫停函數，我有一個警報，顯示變量的值（就像現在的測試一樣）。

問題是，暫停點擊事件不僅提醒當前值，而且還提醒以前的所有值。

這是什麼原因？我能做些什麼來解決它？

在小提琴示例中，按開始，然後按暫停，然後查看所有值。

的jsfiddle：http://jsfiddle.net/Limitedmoves/SrWJP/

$(document).ready(function() { 
    $('.butResize').click(function() { 
     alert("hello"); 
      GameStart();  
    }); 

    function GameStart(){ 
     //Set needed random variables below 
     var vSetTimer = 1000 * Math.floor(Math.random() * 10); 
     var vBarWood = 1 + Math.floor(Math.random() * 400); 

     setTimeout(function() { 
     //alert(vSetTimer); 
      $('.div').animate({height: vBarWood }, 500); 
     GameStart();  
    }, vSetTimer); //Time lenght set from vSetTime variable 

    $('.pause').click(function() { //Start pause function 
     var vTempTimer= vSetTimer; 
     console.log(vTempTimer);  
    }); 
} 
});

我已經看過在這裏的計算器，發現類似的行爲是通過利用「返回」解決了，但是從我已經嘗試過了沒有幫助。

事先感謝！ :)

來源

2013-08-20 user2699097

@ ju-k的解釋是正確的，並提供了一個工作解決方案。然而，另一種解決方案可能如下所示：

$(document).ready(function() { 

    $('.butResize').click(function() { 
     alert("hello"); 
     GameStart(); 
    }); 

    var vSetTimer; 
    var vBarWood; 

    function GameStart(){ 
    //Set needed random variables below 
     vSetTimer = 1000 * Math.floor(Math.random() * 10); 
     vBarWood = 1 + Math.floor(Math.random() * 400); 

     setTimeout(function() { 

      //alert(vSetTimer); 

      $('.div').animate({height: vBarWood }, 500); 

      GameStart();  

     }, vSetTimer); //Time lenght set from vSetTime variable 
    } 

    $('.pause').click(function() { //Start pause function 
     console.log(vSetTimer); 
    }); 

});

即，將變量移動到外部作用域，這也可以解決它，而不必每次都解除綁定/綁定。

編輯正如在評論中指出的那樣，沒有解釋爲什麼它在這個答案中表現得如此。這裏是：

問題中行爲的原因是，正如其他答案中所述，因爲每次調用GameStart時，都會在與選擇器「.pause」匹配的元素後附加一個點擊處理程序。。即第一次運行GameStart時，具有閉包變量（vSetTimer）的處理程序被追加到「.pause」按鈕上。 GameStart下次運行時，它也會這樣做，等等。這個閉包不會改變，這就是爲什麼第一次出現的相同數字第二次出現，接着是下一個閉包變量，依此類推。

來源

2013-08-20 09:42:33

這是一個很好的答案，「我能做些什麼來解決它？」。你可能會添加一個解釋「這是什麼原因？」 – jukempff

感謝您的更新，我現在正在使用此解決方案。從來不知道解決方案是這個初級。謝謝！ – user2699097

每次調用GameStart時，都會向$('.pause')元素添加新的事件處理程序。

所以當你第二次打電話GameStart，點擊.pause將觸發2個功能。

一個簡單的解決辦法是unbind所有以前添加點擊處理程序，添加一個新前：

$('.pause').unbind('click').click(function() { 
    ... 
});

編輯： 爲了更好的和更清潔的解決方案看@比約恩·羅貝格的回答

來源

2013-08-20 09:33:08 jukempff

無需解除綁定。 – Amit

你是對的，沒有必要。但正如我指出的那樣，這將是一個簡單的**解決方案。 – jukempff

謝謝你的意見，我試過了，它按我的需要工作。我想我現在必須閱讀解綁。再次感謝你。 – user2699097

看看更新的fiddle，我已經添加了一個cleartimeout並解決了您的問題。

clearTimeout(timer);

也是我把randNumber外reSize()範圍。

來源

2013-08-20 09:37:55 Daniele

謝謝你的幫助。我也實現了這個解決方案的一部分，因爲它在按暫停時給了我Settimeout（）的確切值。謝謝！ – user2699097

變量內部重複函數保留舊值

回答

相關問題