clearTimeout无法正常工作

Question

我需要清除vf变量但是代码不起作用。不完全确定发生了什么，但我相信这只是一个简单的语法错误。任何人都愿意快速浏览一下，让我知道为什么我这么努力失败？谢谢！

var vf;
if ($(this).removeClass("active")[0] == $(".wwd-li:nth-of-type(1)")[0]) {
    $('#chalkboard').css({ "background-image": "url(" + JSONdata[index].cover + ")" });
    if ($("#picture3").hasClass("picTwoEnter")) {
        $('#picture3').css({ "background-image": "url(" + JSONdata[index + 2].cover + ")" }).removeClass("picTwoEnter").addClass("picTwoExit");
        $('#picture2').css({ "background-image": "url(" + JSONdata[index + 1].cover + ")" }).removeClass("picTwoEnter").addClass("picTwoExit");
    }
    if ($("#picture2").hasClass("picTwoEnter")) {
        $('#picture2').css({ "background-image": "url(" + JSONdata[index + 1].cover + ")" }).removeClass("picTwoEnter").addClass("picTwoExit");
    }
    clearTimeout(vf);
    $("#viewfinder").hide();
}
else if ($(this).removeClass("active")[0] == $(".wwd-li:nth-of-type(2)")[0]) {
    clearTimeout(vf);
    $('#picture2').css({ "background-image": "url(" + JSONdata[index].cover + ")" }).removeClass("picTwoExit").addClass("picTwoEnter");
    if ($("#picture3").hasClass("picTwoEnter")) {
        $('#picture3').css({ "background-image": "url(" + JSONdata[index + 1].cover + ")" }).removeClass("picTwoEnter").addClass("picTwoExit");
    }
    if (JSONdata[index].id == "5") {
        vf = setTimeout(function () { $("#viewfinder").show().addClass("viewfinderSlide") }, 1000);
    }
}
else if ($(this).removeClass("active")[0] == $(".wwd-li:nth-of-type(3)")[0]) {
    $('#picture3').css({ "background-image": "url(" + JSONdata[index].cover + ")" }).removeClass("picTwoExit").addClass("picTwoEnter");
    clearTimeout(vf);
    $("#viewfinder").hide();
}