6

私は Javascript でカスタム スライダーを作成しています。ユーザーがスライダーの div をクリックするたびに、スライダーが X 秒間停止する必要があります。

私のコードは次のとおりです。

$(document).ready(function () {
    var ciclo;
    var index_slide = 1;

    function startSlidercicle() {
        ciclo = setInterval( function() {
            // Slider code goes here
        }, 3000); 
    }

    //Here I start the slider animation
    startSlidercicle();

    //When the user clicks on a div called 'slide', stop the cycle and start again the animation cycle
    $('.slide').on('click', function() {
        clearInterval(ciclo);
        setTimeout(startSlidercicle(), 3000);
    });
});

しかし、問題は、スライダーをクリックして停止するたびに、サイクルの開始がどんどん速くなることです。どうすれば修正できますか？

4

2 に答える 2

5

それ以外の：

clearInterval(ciclo);
setTimeout(startSlidercicle(), 3000);

また：

clearInterval(ciclo);
setTimeout(startSlidercicle, 3000);

コードを次のように変更しました。

clearInterval(ciclo);
startSlidercicle();

そして今、スライダーはうまく機能します。最初の 2 つの提案では、div をクリックするたびに新しい関数が作成され、既存のサイクルに「オーバーラップ」するため、スライダーが高速化されているように見えますが、最初から 1 つのサイクルだけが開始されます。別。

于 2013-08-22T23:21:30.293 に答える
2

これを変更する必要があります：

clearInterval(ciclo);
setTimeout(startSlidercicle(), 3000);

これに：

clearInterval(ciclo);
setTimeout(startSlidercicle, 3000);

既存のコードでは、startSlidercirleすぐに呼び出しており、関数名setTimeout()の後に があるため、発火するまで待機していません。()つまり、すぐに実行して、その実行結果を に渡しsetTimeout()ます。setTimeout()関数の名前の後に no を付けるだけで実行される関数参照を渡すだけ()です。これはよくある間違いです。

于 2013-08-22T22:59:59.220 に答える