jQuery text()가 setTimeout 전에 작동하지 않습니까?

Question

Ajax 요청 후 다음을 수행합니다.

$('#change_ts').text('Defaults Changed!'); 

//blinking part 
var t = setTimeout($('#change_ts').fadeIn('slow'), 500); 
clearTimeout(t); 
var t = setTimeout($('#change_ts').fadeOut('slow'), 500); 
clearTimeout(t); 
var t = setTimeout($('#change_ts').fadeIn('slow'), 500); 
clearTimeout(t); 
var t = setTimeout($('#change_ts').fadeOut('slow'), 500); 
clearTimeout(t); 
var t = setTimeout($('#change_ts').fadeIn('slow'), 500); 
clearTimeout(t); 
var t = setTimeout($('#change_ts').fadeOut('slow'), 500); 
clearTimeout(t); 
var t = setTimeout($('#change_ts').fadeIn('slow'), 500); 
clearTimeout(t); 
var t = setTimeout($('#change_ts').text('Change Text/Size'), 500); 
clearTimeout(t); 

내 메이크업 페이드 인/아웃 윙커입니다. 잘 작동한다.

그러나 깜박이는 부분을 수행 할 때 첫 번째 줄은 아무 효과가 없습니다. 깜박임을 제거하면 범위의 텍스트가 변경됩니다. 그러나 내가 깜빡이를 uncomment하자마자, 그것은 전혀 텍스트를 바꾸지 않느냐?!

이유가 무엇인가요? 모든 도움

업데이트

설정된 제한 시간

덕분에 내가해야 할 일에 대한 쓸모가 없다. 나는 그것을 제거했고 다음과 같은 것을 가지고있다. 그러나 페이드 인/아웃하기 전에 여전히 텍스트를 바꿀 수는 없다.

$('#change_ts').text('Defaults Changed!'); 

$('#change_ts').fadeIn('slow'); 
$('#change_ts').fadeOut('slow'); 
$('#change_ts').fadeIn('slow'); 
$('#change_ts').fadeOut('slow'); 
$('#change_ts').fadeIn('slow'); 
$('#change_ts').fadeOut('slow'); 
$('#change_ts').fadeIn('slow'); 

$('#change_ts').text('Change Text/Size'); 

Answer 1

는이 같은 setTimeout에 콜백 함수를 통과해야합니다

var t = setTimeout(function() { $('#change_ts').fadeIn('slow') }, 500); 

지금 즉시 페이드 함수를 호출하고 setTimeout에 반환 값을 전송하고 있습니다. 타임 아웃 값을 500, 1000, 1500 등과 같이 늘려야합니다. 그렇지 않으면 모든 페이드 인/아웃이 동시에 발생합니다. 루프를 사용하여 값을 설정할 수 있습니다. 그리고 타이머를 즉시 지우는 이유는 무엇입니까? 이것은 당신이 clearInterval(t)를 호출 할 때까지 진행을 계속합니다

var state = true; 
function blink() { 
    state = !state; 
    if (state) 
    $('#change_ts').fadeIn('slow'); 
    else 
    $('#change_ts').fadeOut('slow'); 
} 

var t = setInterval(blink, 500); 

:

for (var i = 1; i <= 6; i += 2) { 
    setTimeout(function() { $('#change_ts').fadeIn('slow') }, 500 * i); 
    setTimeout(function() { $('#change_ts').fadeOut('slow') }, 500 * (i + 1)); 
} 

당신은 또한 타이머를 지울 때까지 깜박 계속됩니다 같은 일반적인 깜박이를 만들 수 있습니다.

---

업데이트 : 두 번째 text 호출이 즉시 실행되기 때문에 첫 번째 text 호출이 효과가 없습니다 이유는 텍스트를 덮어 씁니다. 애니메이션이 완료되기 전에 fadeIn 및 fadeOut이 즉시 반환되므로 두 번째 text 호출이 바로 실행됩니다. 애니메이션이 완료 될 때까지 대기 할 경우에는 다음과 같이 마지막 페이드 기능에 콜백을 첨부해야합니다

$('#change_ts').fadeIn('slow', function() { 
    $('#change_ts').text('Change Text/Size'); 
}); 

Answer 2

방법 대신 jQuery Blink plugin 사용에 대한. 당신은 see the demo here :)