dequeue 메서드

dequeue 메서드는 함수 큐에서 다음 함수를 실행할 수 있게 해줍니다. 메서드가 호출되면 함수가 큐에서 제거된 후 실행됩니다. 함수 체인이 계속 실행되려면 함수가 이 메서드를 호출해야 합니다. 요소에 바인딩된 함수 큐를 작업할 수 있게 해주는 queue 메서드도 참조하세요.

문법

다음과 같이 큐의 다음 함수 작업을 계속할 수 있습니다. 선택적 매개변수로 문자열 형식의 큐 이름을 전달할 수 있습니다. 매개변수를 전달하지 않으면 메서드는 fx 큐와 함께 작동합니다:

javascript.dequeue([큐 이름]);

예제

이 예제에서는 queue 메서드를 사용하여 newcolor 클래스를 추가해 사각형을 초록색으로 다시 칠하는 사용자 정의 함수를 추가합니다. 보시다시피, 그 후 여기서 dequeue가 호출되어 함수를 큐에서 제거하고 다음 함수가 실행될 수 있게 합니다:

html<button id="animate">시작</button>
<div></div>

cssdiv {
  position: absolute;
  margin: 3px;
  width: 50px;
  height: 50px;
  left: 0px;
  top: 30px;
  background: red;
  display: none;
}

div.newcolor {
  background: green;
}

javascript$('#animate').click(function() {
  $('div')
    .show('slow')
    .animate({left: '+=200'}, 2000)
    .queue(function() {
      $(this).addClass('newcolor').dequeue();
    })
    .animate({left: '-=200'}, 500)
    .queue(function() {
      $(this).removeClass('newcolor').dequeue();
    })
    .slideUp();
});

참고 항목