Как сбросить функцию тайм-аута после проверки состояния, которое выполняется перетаскиванием в jQuery и JavaScript

Question

Я пытаюсь сбросить функцию тайм-аута после проверки определенного числа.

У меня есть коробка droppable, где я бросаю перетащить li. Я установил время в течение 10 секунд в функции timeout.

Я хочу проверить, не упало ли количество литий больше 5, timeout функция снова сбросит настройки.

Таким образом, я хочу продолжить, если мои пользователи заполнят каждое пять номеров за каждые 10 секунд, он/она получит еще 10 секунд, чтобы продолжить, если он/она не завершится в течение этого времени, появится сообщение ,

Вот скрипку ссылка:

<div class="wrapper"> 
<ul class='lists'> 
<li>01</li> 
<li>02</li> 
<li>03</li> 
<li>04</li> 
<li>05</li> 
<li>06</li> 
<li>07</li> 
<li>08</li> 
<li>09</li> 
<li>10</li> 
</ul> 
    <div class="dropbox"> 
     drop here 
    </div> 
    <div class="timeover"> 
    time over 
    </div> 
</div> 


// ------------------- script ------------------- 
    $(document).ready(function(){ 
    var timeframe = 10000; 
    // ----------- draggable ------------- 
    $(".lists li").draggable({ 
    revert:true 
    }); 
    // -------------- drop function ------------ 
    $(".dropbox").droppable({ 
    drop: function() { 
    // ------------- 
    var dragelem = $('.ui-draggable-dragging'); 
    $(dragelem).addClass('dropped'); 
    var scoreCard = $(".dropped").length; 
    } 
}); 
setTimeout(function(){ 
     $('.timeover').addClass('show'); 
},timeframe); 
}); 

Нажмите here

Если у вас есть какие-либо другие решения этой ситуации.

Answer 1

Вы должны присвоить значение таймаута в некоторой переменной, а затем вы можете:

var timerId = setTimeout(...); 
clearTimeout(timerId); 

Это половина от вас требуется, но тогда вы можете переназначить его снова или делать другие вещи