[解決済み] JavaScript の clearTimeout が動作しない

質問

(類似の質問/回答はすべて見ましたが、どれも私の問題を解決するものではありませんでした)。

コードです。

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秒よりずっと前に "Loading..." から "Still loading..." にテキストが変わることがあり、まるでタイマーのスレッドがまだ動いているような状態になることがあります。上記のコードに何か問題があるのでしょうか？それとも、他のコードに問題があるのでしょうか？

を編集してください。 ということを付け加えなければなりません。 showLoader(true) は、サーバーからの応答がある前に、もう一度（何度も）呼び出すことができます。

どのように解決するのですか？

が既に存在するかどうかのチェックを追加する必要があります。 timeoutHandle を作成する前に、新しいものを作成します。

を試してみてください。

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

そして、else の場合は timeoutHandle のようにクリアした後、nullに変換します。

clearTimeout(timeoutHandle);
timeoutHandle = null;

これは、もしあなたが showLoader(true) 関数が複数回呼び出されます。