JS clearTimeout이 함수 밖에서 var set을 사용해도 작동하지 않습니다.

Question

마우스를 올리면 미리보기를 표시하려고하지만 마우스를 움직이면 미리보기를 표시하지 않습니다. 현재 마우스를 ".searchRecord"요소로 빠르게 이동하면 300ms 후에 표시되고 setTimeout 함수가 끝나기 전에 함수가 호출 된 것처럼 "멈춤"상태가됩니다. 미리보기가 모든 것이 잘 동작 할 때까지 커서를 요소에 머무르게두면.

다른 곳에서 읽은 변수를 함수 외부에 설정했지만 재설정하지 않았습니다. 나는 좀 이상하다.

var timer; 
$('.searchRecord').hover(function() { 
    $(this).children('.previewLoad').show(); 
    var current = '#'+$(this).children('div').attr('id'); 

    //slight delay before hover so they can select what they want 
    var timer = window.setTimeout(function(){ 
     $(current).fadeIn('fast'); 
     $(current).siblings('.previewLoad').hide(); 
    }, 300); 
}, function() { 
    window.clearTimeout(timer); 
    var current = '#'+$(this).children('div').attr('id'); 
    previewTimeouter(current); 
}); 

Answer 1

타이머 선언이 중복되었습니다. 호버 콜백에서 var timer의 var을 제거하십시오.

var timer; 
$('.searchRecord').hover(function() { 
    $(this).children('.previewLoad').show(); 
    var current = '#'+$(this).children('div').attr('id'); 

    //slight delay before hover so they can select what they want 
    timer = window.setTimeout(function(){ 
     $(current).fadeIn('fast'); 
     $(current).siblings('.previewLoad').hide(); 
    }, 300); 
}, function() { 
    window.clearTimeout(timer); 
    var current = '#'+$(this).children('div').attr('id'); 
    previewTimeouter(current); 
}); 

Answer 2

당신은 그 함수에 범위 및 부모 timer 변수를 그림자 호버 콜백의 내부 다시 var timer을 사용하고 있습니다.

내면 var을 제거하면 모두 양호합니다.