웹개발 공부/제이쿼리

setInterval , clearInterval

붉은아네모네 2017. 6. 7. 00:55

setInterval - 일정시간마다 반복실행하는 함수이다

사용법


var rotate;

rotate = setInterval("rotateText()", 5000);

function rotateText(){

함수내용

}


이라고 하면 rotateText() 함수를 계속 반복한다.

그리고

정지를 위해서

clearInterval(rotate);

를 사용하면 된다. 

사용 예

    $(".showStop").click(function(){

    if(showPS == 1){

        clearInterval(rotae);

    showPS = 0;

       }

    });


정지를 하고 다시실행하려면


rotate = setInterval("rotateText()", 5000);


를 버튼 클릭으로 만들어서 다시 사용할수있게 만들면 되지만

그 버튼을 누르면 누적으로 사용되는 버그가 있기 때문에

(1 -> 2 -> 3 -> 4 -> 5 이라는 숫자이미지를 로테이션 중 일때 

 2에서 "다시재생"버튼 을 누르면 1 21 32 43 54 15 21 32 이런식으로 누적실행되는 버그가 있다)


함수를 써서 

var showPS;

    $(".showPlay").click(function(){

     if(showPS == 0){

     rotae = setInterval("rotateText()", 5000);

     showPS = 1;

     }

    });

    $(".showStop").click(function(){

     if(showPS == 1){

        clearInterval(rotate);

     showPS = 0;

     }

    });

이런식으로 사용하면 된다!!