표시기를 로드하기 위해 setTimeout 또는 setInterval 루프를 중지하는 방법은 무엇입니까?

setTimeout 루프 중지

스프라이트를 사용하여 로딩 표시기를 생성할 때 루프를 사용하여 배경 위치를 순환하는 것이 일반적입니다. 한 가지 접근 방식은 setTimeout 함수를 사용하는 것입니다. 그러나 로드 프로세스가 완료될 때 루프를 중지해야 하는 경우 어떻게 해야 합니까?

setTimeout 구현

JavaScript의 setTimeout 함수는 ClearTimeout 함수를 사용하여 시간 초과를 취소할 수 있는 타이머 핸들입니다. 이를 구현하려면 setBgPosition 함수 내에 stop() 함수를 생성하면 됩니다.

function setBgPosition() {
    var c = 0,
        timer = 0;
    ...
    return stop;

    function stop() {
        if (timer) {
            clearTimeout(timer);
            timer = 0;
        }
    }
}

이를 사용하려면 setBgPosition 함수를 변수에 할당하고 나중에 stop() 함수를 호출하여 루프:

var stop = setBgPosition();
// ... later ...
stop();

대체 접근 방식: setInterval

setTimeout을 사용하는 대신 지정된 간격으로 함수를 반복적으로 실행하는 setInterval이 있습니다. ClearInterval과 함께 사용할 수 있는 방법은 다음과 같습니다.

function setBgPosition() {
    ...
    return setInterval(run, 200);
}

루프를 중지하려면:

var timer = setBgPosition();
// ... later ...
clearInterval(timer);

그러나 완료 조건을 감지하고 setBgPosition이 루프를 중지하도록 허용하는 옵션을 탐색하는 것이 좋습니다. 루프 자체. 이 접근 방식은 로딩 작업 처리에 있어 더 큰 제어력과 유연성을 제공합니다.

위 내용은 표시기를 로드하기 위해 setTimeout 또는 setInterval 루프를 중지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!