지수주기가 감소하는 Setinterval

Question

setinterval을 사용하여 mousedown 이벤트가 발생했습니다. 나는 간격의 시간을 가변적으로하고 싶다. 첫 번째 것은 500, 두 번째 것은 500/2 = 250 등입니다.

$plus.mousedown(function(e) { 
    increment(20) 
    timeout = setInterval(function(){ 
     increment(20) 
    }, 500); 
}); 
$(document).mouseup(function(){ 
    clearInterval(timeout); 
    return false; 
}); 

건배!

편집 : 모호한 점에 대해 사과드립니다. mousedown을하는 동안 간격이 바뀌길 바란다. 따라서 mousedown이 수행되는 동안 intervaltime이 변경되어야합니다. 마우스 클릭 하나 하나를 클릭하지 않고 연속 클릭으로 한 번씩 클릭 한 다음 다시 설정하십시오.

Answer 1

당신이뿐만 아니라 작성할 수 있도록 비슷한 달성하기 위해 주위 setTimeout(), 지연 변화에 대한 래퍼를 삭제 유지하지 않는 한 당신은 정말 setInterval()이 할 수없는

:

function easingTimeout(delay, fn) 
{ 
    var id, 
    invoker = function() { 
    fn(); 
    delay = Math.floor(delay/2); 
    if (delay) { 
     id = setTimeout(invoker, delay); 
    } else { 
     id = null; 
    } 
    } 

    // start it off 
    id = setTimeout(invoker, delay); 

    return { 
    clear: function() { 
     if (id) { 
     clearTimeout(id); 
     id = null; 
     } 
    } 
} 

사용하려면 :

을 이 솔루션은 jQuery를에 의존하지 않는

var timeout; 

$plus.mousedown(function(e) { 
    increment(20); 
    timeout = easingTimeout(500, function() { 
     increment(20); 
    }); 
}); 

$(document).mouseup(function(){ 
    timeout.clear(); 
    return false; 
}); 

Answer 2

:

var timeoutInterval = 500; 
var mousedown = false; 

function incrementAndWait() { 
    if (!mousedown) return; 
    increment(20); 
    timeout = setTimeout(incrementAndWait, timeoutInterval); 
    timeoutInterval /= 2; 
} 

document.onmousedown = function() { 
    timeoutInterval = 500; // Reset to 500 to allow multiple mousedown/mouseup 
    mousedown = true; 
    incrementAndWait(); 
}; 

document.onmouseup = function() { 
    mousedown = false; 
} 

을 incrementAndWait 메소드에 추가하여 콘솔에있는 숫자를 볼 수 있습니다. 뭔가 재미있는 놀이 :)