fadeout/fadein 전에 jquery load ()를 완료하려면 어떻게해야합니까?

StackOverflow https://stackoverflow.com/questions/1550642

  •  20-09-2019
  •  | 
  •  

문제

jQuery load ()를 통해 Ajax 호출을하고 일단 돌아 오면 이전 컨텐츠를 페이 아웃하고 새 컨텐츠를 희미하게합니다. 새 콘텐츠가 검색 될 때까지 오래된 콘텐츠가 계속 표시되기를 원합니다.

사용 :

$('#data').fadeOut('slow').load('/url/').fadeIn('slow');

콘텐츠가 사라지고 몇 분이 지나면 나중에로드 () 호출이 반환되고 데이터가 업데이트되지만 페이드는 이미 완료되었습니다.

도움이 되었습니까?

해결책

콜백을 사용하여 통화 순서를 제어하십시오.

var $data = $('#data');
$data.fadeOut('slow', function() { 
    $data.load('/url/', function() { 
        $data.fadeIn('slow'); 
    }); 
});

(참고 : 사용하는지 100% 확실하지 않습니다. var $data = ... 그리고 $data.doStuff() 실제로 작동합니다. 그렇다면 매번 Dom Tree에서 DIV를 찾아 보지 않아도되지만, 그렇지 않은 경우 첫 번째 줄을 제거하고 사용합니다. $('#data') 어디에나...

다른 팁

문제는 세 가지 함수, 페이드 아웃,로드 및 페이드 인이 비동기식이라는 사실과 관련이 있습니다. 위의 각 함수는 함수가 실행을 완료했을 때 실행되는 콜백 인수 (함수)를 수락합니다. 예를 들어

$('#data').fadeOut(functionToRunWhenFadeOutIsComplete);

// 'FunctionTorUnFadeOutIsComplete'를 정의한 경우 FadeOut이 끝난 후 실행됩니다.

이 지식으로 무장하면 이제 문제를 해결할 수 있습니다.

var fadeInData = function fadeInData() { $('#data').fadeIn(); }
var loadData = function loadData() { $('#data').load('url', fadeInData); }
$('#data').fadeOut(loadData);

또는 LoadData, FadeIndata를 인라인 익명 함수로 정의 할 수 있습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top