jquery의 wait () 또는 sleep () 함수?

수업을 추가하고 2 초간 기다렸다가 다른 수업을 추가하고 싶습니다.

.addClass("load").wait(2sec).addClass("done");

방법이 있습니까?

setTimeout은 일정 시간 (밀리 초 단위로 측정) 지연 후 일부 코드를 실행합니다. 그러나 중요한 참고 사항 : 자바 스크립트의 특성으로 인해 나머지 코드는 타이머가 설정된 후에도 계속 실행됩니다.

$('#someid').addClass("load");

setTimeout(function(){
  $('#someid').addClass("done");
}, 2000);

// Any code here will execute immediately after the 'load' class is added to the element.

그것은 .delay().

http://api.jquery.com/delay/

AJAX 작업을 수행하는 경우 "완료"를 자동으로 작성해서는 안됩니다. 실제로 응답을 기다렸다가 실제로 완료되었는지 확인해야합니다.

delay ()는 작업을 수행하지 않습니다. delay ()의 문제는 애니메이션 시스템의 일부이며 애니메이션 대기열에만 적용된다는 것입니다.

애니메이션 밖에서 뭔가를 실행하기 전에 기다리고 싶다면 ??

이것을 사용하십시오 :

window.setTimeout(function(){
                 // do whatever you want to do     
                  }, 600);

어떻게 되나요? :이 시나리오에서는 중괄호 안에 지정된 코드를 실행하기 전에 600 밀리 초를 기다립니다.

이것은 내가 그것을 이해하고 당신에게도 도움이되기를 바랍니다.

중요 공지 : 'window.setTimeout'은 비동기 적으로 발생합니다. 코드를 작성할 때 염두에 두십시오!

이것은 오래된 질문이라는 것을 인식하지만 누군가 유용하다고 생각할 수있는이 문제를 해결하기 위해 플러그인을 작성했습니다.

https://github.com/madbook/jquery.wait

다음을 수행 할 수 있습니다.

$('#myElement').addClass('load').wait(2000).addClass('done');

기능이 있지만 추가 기능이 있습니다. http://docs.jquery.com/Cookbook/wait

이 작은 스 니펫을 사용하면 기다릴 수 있습니다.

$.fn.wait = function(time, type) {
    time = time || 1000;
    type = type || "fx";
    return this.queue(type, function() {
        var self = this;
        setTimeout(function() {
            $(self).dequeue();
        }, time);
    });
};

.delay()기능을 사용할 수 있습니다 .
이것이 당신이 추구하는 것입니다.

.addClass("load").delay(2000).addClass("done");

xml4jQuery 플러그인은 sleep (ms, callback) 메소드를 제공합니다. 나머지 체인은 수면 기간 후에 실행됩니다.

$(".toFill").html("Click here")
                .$on('click')
                .html('Loading...')
                .sleep(1000)
                .html( 'done')
                .toggleClass('clickable')
                .prepend('Still clickable <hr/>');

.toFill{border: dashed 2px palegreen; border-radius: 1em; display: inline-block;padding: 1em;}
        .clickable{ cursor: pointer; border-color: blue;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <script type="text/javascript" src="https://cdn.xml4jquery.com/ajax/libs/xml4jquery/1.1.2/xml4jquery.js"></script>
        <div class="toFill clickable"></div>

setTimeout 함수 사용 (예 : 여기 방문)