jQuery를 동시에

Question

죄송 다중 호출을 실행하는 것 같다,하지만 분명히 나는이 문제를 파악하기에 충분 체인 이해가 안 ...

내가 jQuery를 회전 목마 플러그인 (jCarouselLite)을 구현 그리고 난 노력하고있어 (현재 <div class="remove">) 회전 목마 항목 중 하나를 '제거'할 수있는 옵션이 추가

initEvents: function() { 
     var self = this; 
     // Bind jQuery event for REMOVE button click 
     $('.remove').live('click', function() {  
      // Need to save the ID that we're removing 
      var item = $(this).closest('li.sort'); 
      var itemId = item.attr("id"); 

      $(this).removeItem(); 

      self.refreshDisplay(itemId); 
     }); 


$.fn.removeItem = (function() { 
    var item = this.closest('li.sort'); // could save this call by passing param 

    item.fadeOut("normal", function() { 
     $(this).remove(); 
     }); 

    // preserve jQuery chain 
    return this; 
}); 
}, 

refreshDisplay(itemId) { 
    // ... 
    // redraws carousel 
    // ... 
    // itemId is used to remove from the array of Items to show (class-wide scope) 
} 

더 깨끗한 방법으로 '새로 고침'을 jCarouselLite 플러그인 (I 실제에서 구현하려고합니다 어쩌면 무언가가 없기 때문에

나중에 플러그인)이 작업에 대한 신속하고 지저분한 해결은 회전 목마를 재생성하는 것입니다.

문제는 클릭 한 요소를 페이드 아웃하려하지만 클릭 한 항목을 페이드 아웃 (및 제거)하는 애니메이션이 완료되기 전에 refreshDisplay()가 호출 된 것처럼 보입니다. self.refreshDisplay(itemId); 행을 주석 처리하여이를 확인했으며, 예상대로 페이드 아웃하고 제거합니다.

이렇게 체인을 연결해야하는 특정 방법이 있습니까? 나는 연쇄 작용이 어떻게 작용하는지에 대한 몇 시간의 독서를했으며, 나는 그것을 이해했다고 생각했지만 분명히는 아니었다.

모든 도움을 주시면 감사하겠습니다.

Answer 1

체인 연결 목적은 여러 명령이 기본 개체를 공유 할 수 있도록 허용하지만 각 명령이 이전 명령을 기다리지 않도록합니다.

이 경우 콜백을 사용해야합니다. 비슷한 것

initEvents: function() { 
     var self = this; 
     // Bind jQuery event for REMOVE button click 
     $('.remove').live('click', function() {  
      // Need to save the ID that we're removing 
      var item = $(this).closest('li.sort'); 
      var itemId = item.attr("id"); 

      $(this).removeItem(function() { 
       self.refreshDisplay(itemId); 
      }); 
     }); 


$.fn.removeItem = (function(callback) { 
    var item = this.closest('li.sort'); // could save this call by passing param 

    item.fadeOut("normal", function() { 
     $(this).remove(); 
     callback(); //now your refresh is being called after the fade. 
     }); 

    // preserve jQuery chain 
    return this; 
}); 
},