자바 스크립트 사항 clearInterval

Question

을 삭제하지 나는 다음과 JS 코드를 가지고

$('body').on({ 
    click: function() 
    { 
     var el = $(this); 
     lookUpTask(el); 

     el.bind('blur', function(){ 
      timeOutTask = setInterval(function(){ 
       if(timeOutTask) 
       { 
        clearInterval(timeOutTask); 
        el.trigger('remove_match'); 
       } 
      }, 500); 

      $('body').on({ 
       click: function(event) 
       { 
        var match = $(this); 
        var color = match.attr('color'); 

        // Check color to change brightness 
        var brightness = hexToLuminance(color); 
        var text_color = '#000'; 
        if(brightness < 128) { 
         text_color = '#fff'; 
        } 

        // Change color according to brightness 
        el.css('color',text_color); 
        el.parent().parent().children('.remove').css('color',text_color); 
        el.parent().parent().children('.resize').css('color',text_color); 

        // Change the background and task name 
        el.parent().parent().css('background-color', color); 
        el.val(match.html()); 

        // Update DB 


        // Remove the task_match 
        el.trigger('remove_match'); 
       } 
      },'.match'); 
     }); 

     el.bind('remove_match', function(){ 
      if(el.val == "") { 
       el.val('Select Task'); 
      } 
      el.css('text-align','center'); 
      el.parent().children('.match_results').remove(); 
      clearInterval(timeOutTask); 
     }); 
    }, 
    keyup: function(event) 
    { 
     lookUpTask($(this)); 
    } 
},'.task_select'); 

사용자가 그때가 일치하는 결과를 불러와 화면에 표시, .task_select를 클릭 할 때 내가 뭘하려고 오전입니다. 이제 사용자는 해당 옵션 중 하나를 선택하거나 외부를 클릭 할 수 있습니다. 바깥 쪽이면 일치하는 결과가 닫혀 야합니다. 옵션 중 하나를 선택하면 중간의 전체 코드가 실행됩니다.

문제는 일치하는 결과가 다른 div 상단에 오버레이되어 클릭하면 다른 것이 발생한다는 것입니다. 일치하는 결과를 클릭하면 코드가 바깥 쪽을 클릭하면 등록됩니다 (일치하는 선택 항목이 사라지고 클릭하지 않으려는 다른 div를 클릭 한 것처럼 효과가 나타납니다)

그래서 내 솔루션은 외부에 클릭하기 전에 타이머를 배치하는 것이 었습니다. clearInterval 타이머를 clearout 않는 제외하고 모두 잘 작동 !! 그래서 내가 타이머를 지우지 않은 것처럼 그것은로드 할 두 번째 시간입니다!

왜?!

Answer 1

당신은 새로운 간격으로 timeOutTask을 무시하고 당신은 배열에 간격을 캐시 할 수 있습니다, 뭔가를 같이 :.

var timeOutTasks = []; 
$('body').on({ 
    ... 
    el.bind('blur', function(){ 
     timeOutTasks.push(setInterval(function(){ 
      clearInterval(timeOutTasks.pop()); 
         ... 
     }, 500); 
      ... 
    } 
      ... 
}