2014-11-26 4 views
0

안녕에 따라 후 작업을 실행 내가 마우스 버튼을 떠날톤 이미지를 통해 클릭 얼마나 많은 시간에 따라 (PHP 파일을 실행) 두 개의 서로 다른 작업을 실행해야합니다. 내가 취급하고있는 이벤트는 onmousedownonmouseup입니다.자바 스크립트 -의 setTimeout이 값

< 500t 만약 MS, 그렇지 않으면 작업 # 2를 실행 된 작업 # 1을 실행합니다.

그래서, 내 기본 자바 스크립트 지식을 바탕으로, 나는이 코드를 작성 :

var lastTime = 0; 
var now = 0; 
var tmptimer = 0; 
var mousedown = false; 

/* to be executed from onmousedown event */ 
function tsMouseDown(angleH, angleV) 
{ 
    var angleH2 = parseFloat(angleH); 
    var angleV2 = parseFloat(angleV); 
    var div = document.getElementById("debugDiv"); 
    div.textContent = 'tsMouseDown: ' + angleH + " - " + angleV + ' - '; 

    mousedown = true; 
    lastTime = new Date().getTime(); 
    tmptimer = setTimeout(function(){ ;}, 500); 
    div.textContent = 'tsMouseDown: ' + angleH2 + " - " + angleV2 + ' - ' + tmptimer + ' - ' + mousedown; 

    /* 
    try to execute task #1 or #2 depending on mousedown value 
    (!) DOES NOT WORK 
    */ 
    if(mousedown == false) 
    { 
    $("#content").load("task1.php",{ /* args here ... */ }); 
    } 
    else if(mousedown == true) 
    { 
    $("#content").load("task2.php",{ /* args here ... */ }); 
    } 
} 

/* to be executed from onmouseup event */ 
function tsMouseUp() 
{ 
    mousedown = false; 
    clearTimeout(tmptimer); 
    tmptimer = -1; 
    var div = document.getElementById("debugDiv"); 

    now = new Date().getTime(); 

    if((now - lastTime) < 500)) 
    div.textContent = "tsMouseUp: " + (now - lastTime) + "< 500 ms - " + tmptimer + ' -' + mousedown; 
    else 
    div.textContent = "tsMouseUp: " + (now - lastTime) + "> 500 ms" + tmptimer + ' -' + mousedown; 
} 

코드 고급 마우스 버튼을 클릭 한 상태로 유지됩니다 얼마나 많은 시간을 인식하지만, 기능에 mousedown 변수에 대한 조건 작동 tsMouseDown은 내가 원하는대로 평가되지 않습니다. 왜냐하면 tsMouseUp이 timeout 전에 실행 되더라도 task2.php가 항상 실행되기 때문입니다.

이 상황을 해결하는 더 좋은 방법은 무엇입니까? 작동하도록 코드를 변경하려면 어떻게해야합니까?

미리 감사드립니다.

답변

0

A는 예를 들어 .. 명확하게 서로에 이벤트를 바인딩하는 것입니다 비트 :

var longTouch = false; 
$(this).mousedown(function() { 
    timeout = setTimeout(function() { 
     longTouch = true; 
    }, 500); 
}).mouseup(function() { 
    clearTimeout(timeout); 
    if (longTouch && longTouch == true) { 
     // do whatever you want if it was longer than 500ms 
    } else { 
     //else do click actions 
    }   
}); 
longTouch = false; 

mouseup 이벤트 인터럽트mousedown 또는 그 이상 다음 지정된 간격보다 한 경우 주위에 이런 식으로 다른 동작을 수행합니다. 나는 그것이 충분히 분명하기를 바란다.

는 나는 내가 시도한 jsFiddle to demonstrate.

+0

당신의 기능을 가진 코드의 대체 값 주요 부분을 포함하도록했습니다,하지만 작동하지 않습니다. –

+0

그러면 뭔가 잘못하고있는 것입니다 - 바이올린에 따르면 그것은 분명히 작동합니다. '$ (this) '를 요소로 변경 했습니까? – Dropout

+0

$ ('name_id')로 변경했습니다. –