Variable inside repeating function keeps old values
I am new to Jquery and I can't seem to find a what is the cause of this
issue.
I have a variable which gets a new value each time the function
GameStart() runs, to this function I am trying to create a pause function,
in the pause function I have an alert which displays the value of the
variable (just as a test for now).
The issue is that the pause click event does not only alert the current
value but also all the previous ones.
What is the cause of this? And what can I do to fix it?
In fiddle example press Start and the press Pause every now and then to
see all values.
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);
});
}
});
I have looked around here at stackoverflow and found similar behavior
being solved by using "return", but from what I have tried it hasn't
helped.
Thanks beforehand! :)