清除数组中的超时(如果存在)

Clear timeouts in array if they exist

我这辈子都不知道如何清除数组中存在的超时。

我有一个单页应用程序 (SPA) 网站 (http://www.rock3t.ca/),每次单击 "Home" 时 ID 都会增长得非常快,这似乎并没有取消超时。访问该站点,您会看到中心徽标下的标语以非常快的速度变化,然后变慢。快速点击 "Home" 多次以查看其反应。它还没有清除,你会注意到光点。

//slogans
function loadSlogans(){

    //slogan timeouts
    var sloganTimeouts = [];

    //slogans
    var slogans = ['Websites', 'Apps', 'Media', 'Code', 'SEO', 'CRM','Ads','Flyers','Logos','Games','Streams','Web','Websites', 'Apps', 'Media', 'Code', 'SEO', 'CRM','Ads','Flyers','Logos','Games','Streams','Web'];

    var sloganTime = 100;
    var sloganTimeFade = 0;
    var slogans_length = slogans.length;
    var sloganHalfTime = slogans_length / 2;

    //clear slogan timeouts
    $(slogans).each(function(i){

        //clear timeout if exists
        if(typeof sloganTimeouts[i] !== "undefined"){
          clearTimeout(sloganTimeouts[i]);
        }
    });

    //slogan timeout
    function runSloganTimeout(i) {

        //easing out time when half way
        if(i > sloganHalfTime){
            sloganTimeFade++;
            sloganTime = (i * 100) + (sloganTimeFade * 100) * (sloganTimeFade / 4);
        }else{
            sloganTime = i * 100;
        }

        //set timeouts
        sloganTimeouts[i] = setTimeout(function(){

            //append slogans
            $('#slogan span').html(slogans[i]);

        },sloganTime);
    }

    //each slogan
    $(slogans).each(function(i){

        //run
        runSloganTimeout(i);
    });
}

谢谢

已经清除了,但是前面的流程还没有结束,所以你不会清除所有即将到来的超时。 解决方法之一:添加processId global var,中断之前的进程。 看我的例子: Plunker

var processId = 0;

//slogans
function loadSlogans(){

    processId++;

    var selfProcessId = processId;

    //slogan timeouts
    ...
    //slogans
    ...
    //clear slogan timeouts
    ...

    //slogan timeout
    function runSloganTimeout(i) {
        //easing out time when half way
        ...
        //set timeouts
        sloganTimeouts[i] = setTimeout(function(){
            //append slogans
            if( selfProcessId == processId )
                $('#slogan span').html(i+slogans[i]);

        },sloganTime);
    }

    //each slogan
    $(slogans).each(function(i){

        //run
        if( selfProcessId == processId )
            runSloganTimeout(i);
    });
}