dblclick이 예상대로 작동하지 않습니다.

Question

II 여기에 http://jsfiddle.net/ggHwH/이 있는데, UP 버튼을 누를 때마다 상자 경계가 1px 씩 증가하고 DOWN 버튼을 누를 때마다 경계가 1px 감소합니다. 이제는 아래쪽 버튼을 두 번 클릭하여 경계를 즉시 0으로 줄이고 싶습니다. 저는 havng 문제는 한 번에 한 번에 경계선을 한 번 클릭하려고하면 ' 초당 약 1 회 이상 빠르게 버튼을 클릭하더라도 두 번 클릭을 트리거합니다. 두 번 누르기를 실행하려면 두 번의 클릭을 약 250ms 미만으로 수행해야합니다. 아무도 무슨 일이 일어나는지 알아?

감사합니다.

$('#up').click (function() { 
     $('#box').css({'border-top-width' : '+=1px', 'borderRightWidth' : '+=1px','borderBottomWidth' : '+=1px','borderLeftWidth' : '+=1px'}); 
    }); 

$('#down').click (function() { 
    $('#box').css({'border-top-width' : '-=1px', 'borderRightWidth' : '-=1px','borderBottomWidth' : '-=1px','borderLeftWidth' : '-=1px'}); 
}); 

$('#down').dblclick (function() { 
    $('#box').css({'border-top-width' : '0px', 'borderRightWidth' : '0px','borderBottomWidth' : '0px','borderLeftWidth' : '0px'}); 
}); 

Answer 1

은 click 섞인 dblclick 좋은의 연습 밤은 데.

그러나 문제의 경우 자신을 "dblclick"으로 만들 수 있습니다.

var isDbl = false; 
var timer = null; 

그런 다음 click 기능은 250ms의 타이머를 설정하고 조건이 있습니다 : 당신은이 VAR를 추가 할 필요가

$('#down').click (function() { 
    clearTimeout(timer) 
    timer = setTimeout(function(){ 
     isDbl = false 
    }, 250) 
    if(isDbl){ 
     $('#box').css({'border-top-width' : '0px', 'borderRightWidth' : '0px','borderBottomWidth' : '0px','borderLeftWidth' : '0px'}); 
     isDbl = false; 
    }else{ 
     $('#box').css({'border-top-width' : '-=1px', 'borderRightWidth' : '-=1px','borderBottomWidth' : '-=1px','borderLeftWidth' : '-=1px'}); 
    isDbl = true 
    } 
}); 

바이올린 : http://jsfiddle.net/ggHwH/4/