JavaScript clearTimeout不起作用

Question

(我看过所有类似的问题/答案,但没有一个能解决我的问题.)

代码:

var timeoutHandle;

function showLoader(show) {
    if (show) {
        $('.loader').html('Loading...');
        $('.loader').show();

        timeoutHandle = setTimeout(function () {
            if ($('.loader').is(':visible')) {
                $('.loader').html('Still loading...');
            }
        }, 15000);
    }
    else {
        $('.loader').hide();
        clearTimeout(timeoutHandle);
    }
}

AJAX函数只是showLoader(true)在调用服务器之前调用,然后showLoader(false)在结果之后调用.我有时会在15秒之前看到文本从"正在加载..."更改为"仍然加载...",因此就好像计时器线程仍在运行一样.上面的代码有什么问题吗？或者问题可能与其他代码有关..

编辑:我必须添加,showLoader(true)可以在服务器响应之前再次(再次)调用

Answer 1

timeoutHandle在创建新的之前,您应该添加一个检查以查看是否已有.

试试这个:

if(timeoutHandle){
    clearTimeout(timeoutHandle);
    timeoutHandle = null;
}
timeoutHandle = setTimeout(function () {
    if ($('.loader').is(':visible')) {
        $('.loader').html('Still loading...');
    }
}, 15000);

然后在其他情况下设置timeoutHandle为null后清除它像这样:

clearTimeout(timeoutHandle);
timeoutHandle = null;

如果showLoader(true)多次调用函数,这将消除创建并发超时的可能性.