clearTimeout 在幻灯片放映中不起作用

Question

我有全宽幻灯片。所以我有一些问题。一是 clearTimeout 不起作用。如果我通过点击调用函数，它应该清除超时。

有人知道为什么这行不通吗？请解释并显示问题的确切位置。

谢谢你，抱歉我的英语不好。

var index = 0;
var slideSpeed = 1000;
function mainSlider(menuLink){
    clearTimeout(slide);
    if(menuLink !== false){
        alert('You call this function by a click event.');
        clearTimeout(slide);
    }
    var sliderIndex = $('.main_slider_content').length - 1;
    $('.main_slider_content').hide();
    index++;
    if(index > sliderIndex){
        index = 0;
    }
    $('.main_slider_content:eq(' + index + ')').show();
    var slide = setTimeout(function(){mainSlider(false)}, slideSpeed);
    setTimeout(countContentImg(index), slideSpeed);
}
$(document).on('click', '.main_slider_menu_link',function(){
    var linkIndex = $(this).index();
    mainSlider(linkIndex);
});
function countContentImg(index){
    $('#main_slider_selected_img').html('');
    var sliderIndex = $('.main_slider_content').length;
    for(var i = 0; i < sliderIndex; i++) {
        if(i === index)
            $('#main_slider_selected_img').append('<li class="main_slider_menu_link main_slider_menu_link_slected"></li>');
        else
            $('#main_slider_selected_img').append('<li class="main_slider_menu_link"></li>');
    }
}
$(document).ready(function(){
    countContentImg(index);
    mainSlider(false);
});

Answer 1

这看起来像是范围问题。您正在尝试从尚未包含超时引用的变量中清除超时。每次调用 mainSlider 都会创建一个新的本地范围的超时引用，在您尝试清除它很久之后。

function mainSlider(menuLink){
    clearTimeout(slide); // Clearing a timeout that doesn't exist yet
    if(menuLink !== false){
        alert('You call this function by a click event.');
        clearTimeout(slide); // Clearing a timeout that doesn't exist yet
    }
    var sliderIndex = $('.main_slider_content').length - 1;
    $('.main_slider_content').hide();
    index++;
    if(index > sliderIndex){
        index = 0;
    }
    $('.main_slider_content:eq(' + index + ')').show();
    // Now the timeout exists, but only in the scope of this current call
    var slide = setTimeout(function(){mainSlider(false)}, slideSpeed); 
    setTimeout(countContentImg(index), slideSpeed);
}

改为：

var slide;
function mainSlider(menuLink){
    clearTimeout(slide);
    if(menuLink !== false){
        alert('You call this function by a click event.');
        clearTimeout(slide);
    }
    var sliderIndex = $('.main_slider_content').length - 1;
    $('.main_slider_content').hide();
    index++;
    if(index > sliderIndex){
        index = 0;
    }
    $('.main_slider_content:eq(' + index + ')').show();
    // Remove var
    slide = setTimeout(function(){mainSlider(false)}, slideSpeed); 
    setTimeout(countContentImg(index), slideSpeed);
}

clearTimeout 在幻灯片放映中不起作用

clearTimeout doesn't work in slideshow

javascript

jquery

timeout