2012-06-25 2 views
3

아래의 for 루프에있는 모든 fadeOut을 실행 한 후에 함수를 실행하려면 어떻게해야합니까?for 루프의 콜백 함수는 무엇입니까?

내가해야 할 일은 페이드 아웃으로 특정 개체를 볼 수 있고 퇴색시키는 것입니다. 스타일링 요구 사항으로 인해 topnav와 dropdown nav가 다른 uls에 있기 때문에 상황이 까다 롭습니다.

나는 아직 내 자신의 스크립트를 작성하는 데 익숙하지가 않다. 그래서 나는 기본적인 것을 놓치고있다. ... 어떤 도움

감사를

나는 기능에 포장 일을 시도했다하지만 변수 범위와 이해하지 않는 나사 일까지 엉망에 보인다!

$('.ksddtop').on('mouseenter', function(){ 
    var ddtop = $(this).text(); 
    var dd = $('.' + ddtop); 
    $('.ksddwrap').fadeIn(); 
    $(dd).fadeIn(); 

    var ksdds = $('.ksdd'); 
    for(var i = 0; i < ksdds.length; i++) { 
     var ksdd = ksdds[i]; 
     if (! $(ksdd).hasClass(ddtop)){ 
      $(ksdd).fadeOut(); 
     } 
    } 
}); 

답변

6

이것은, 그것을 수행해야합니다

$('.ksdd:not(' + ddtop + ')').fadeOut().promise().done(function(){ 
    // all done fading! 
}); 

페이드 아웃 모든 ksdd 요소를 그가 없습니다.클래스를 만든 다음 애니메이션이 끝나면 무언가를하십시오.

추가 정보 :

JQuery와 컬렉션 .promise를 호출하는 당신에게 요소의 컬렉션에있는 모든 애니메이션이 완료되면 해결할 약속 개체를 제공합니다. 여기에는 대기중인 애니메이션이 포함됩니다.

.fadeOut()에 직접 콜백 함수를 전달한 경우 모두 수행 한 후에 각 요소에 대한 콜백 이 표시됩니다.

+0

예! 이것은 아름답게 작동합니다! 왜 이것이 효과가 있는지 설명해 주시겠습니까? promise() 함수는 무엇입니까? (jquery 문서를 보면 ...)? 당신의 도움을 주셔서 감사합니다! – luetkemj

+0

추가 정보 주셔서 감사합니다! promise()는 내가 필요한 것! 지금 도구 상자에있는 것이 멋지 네요! – luetkemj

1

대신 :

var ksdds = $('.ksdd'); 
for(var i = 0; i < ksdds.length; i++) { 
    var ksdd = ksdds[i]; 
    if (! $(ksdd).hasClass(ddtop)){ 
     $(ksdd).fadeOut(); 
    } 
} 

시도 : 내가 요구 사항을 이해한다면

$('.ksdd').each(function(){ 
    if (! $(this).hasClass(ddtop)){ 
     $(this).fadeOut(); 
    } 
});