Javascript clearTimeout() not working

When I try to clearTimeout(), the timeout just continues.
Code:

function autoSlides(x) {
var timeOut;
if (x == 1) {
plusSlides(1);
document.getElementById("switch").onclick = function () { autoSlides(2) };
timeOut = setTimeout(function () { autoSlides(1) }, 4000);
} else if (x == 2) {
clearTimeout(timeOut);
document.getElementById("switch").onclick = function () { autoSlides(1) };
}
}

`timeOut` is a variable local to `autoSlides`.

`autoSlides` has an if statement so it will either:

* Assign a value to `timeOut`
* Try to use `timeOut` to clear a timeout

Since it never does both, the value of `timeOut` will always be `undefined` in the second case.

If you want to reuse the variable across multiple calls to the `autoSlides` function then you need to declare it **outside**, not inside, `autoSlides`.

You can assign "timeout" to outside of the function scope. One option is to attach it to the global "window" object if your using client-side javascript:

window.timeOut = setTimeout(function () { autoSlides(1) }, 4000);

clearTimeout(window.timeOut);

That's because you're declaring `timeOut` inside of the function. That means that you aren't using the same value you thought you saved earlier.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

function autoSlides(x) {
var timeOut; // Initialized to `undefined`
if (x === 1) {
timeOut = setTimeout(function() {
console.log('Look, the timeout finished');
}, 1000);
} else if (x === 2) {
// Remember: this is a new timeout variable
// So this really means `clearTimeout(undefined)`
clearTimeout(timeOut);
}
}

autoSlides(1);
autoSlides(2);

<!-- end snippet -->

What you need to do is save the timeout ID somewhere outside of the function.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

var timeOut; // Won't be reset every time the function is called
function autoSlides(x) {
if (x === 1) {
timeOut = setTimeout(function() {
console.log('Look, the timeout never finishes');
}, 1000);
} else if (x === 2) {
// The value was saved last time
clearTimeout(timeOut);
console.log('cleared the timeout');
}
}

autoSlides(1);
autoSlides(2);

<!-- end snippet -->