區分點擊vs mousedown/mouseup

Question

我已經閱讀了有關這種情況的幾個答案，但沒有一個解決方案正在工作。

我試圖做基於用戶是否點擊的元素，或向下按住鼠標使用jQuery該元素的不同的事情。

可以做到這一點嗎？

Answer 1

這裏有一個方法

1. 設置爲true
變量
2. 使調用時
3. 有一個計時器（setTimeout()），將其設置爲false的功能開始鼠標按下倒計時（）
4. 上的mouseup，清除超時，並檢查是否變量是真還是假
5. 如果是假的，叫你想在點擊
6. 在任何情況下發生的功能，設置變量回真正的

這將做你想做的。 這裏是展示它如何工作的jsfiddle：http://jsfiddle.net/zRr4s/3/

Answer 2

當按下左或右（或中間）onmousedown事件將觸發。同樣，當任何按鈕被釋放時，onMouseUp都會觸發。單擊在對象上，當鼠標移動，然後關閉它，而onMouseUp將觸發如果你點擊和其他地方按住按鈕，然後釋放它的對象上面onmousedown事件仍將觸發。當按下和在同一對象上釋放鼠標左鍵

的onClick纔會觸發。如果你關心的秩序，如果相同的對象有3點所有設置的事件，這是onmousedown事件，onMouseUp，然後的onClick。每個甚至應該只觸發一次。

詳情：

• http://api.jquery.com/click/
• http://api.jquery.com/mouseup/
• http://api.jquery.com/mousedown/

Answer 3

下面是一個同時支持點擊和持有的解決方案：

// Timeout, started on mousedown, triggers the beginning of a hold 
var holdStarter = null; 
// Milliseconds to wait before recognizing a hold 
var holdDelay = 500; 
// Indicates the user is currently holding the mouse down 
var holdActive = false; 
// MouseDown 
function onMouseDown(){ 
    // Do not take any immediate action - just set the holdStarter 
    // to wait for the predetermined delay, and then begin a hold 
    holdStarter = setTimeout(function() { 
     holdStarter = null; 
     holdActive = true; 
     // begin hold-only operation here, if desired 
    }, holdDelay); 
} 
// MouseUp 
function onMouseUp(){ 
    // If the mouse is released immediately (i.e., a click), before the 
    // holdStarter runs, then cancel the holdStarter and do the click 
    if (holdStarter) { 
     clearTimeout(holdStarter); 
     // run click-only operation here 
    } 
    // Otherwise, if the mouse was being held, end the hold 
    else if (holdActive) { 
     holdActive = false; 
     // end hold-only operation here, if desired 
    } 
} 
// Optional add-on: if mouse moves out, then release hold 
function onMouseOut(){ 
    onMouseUp(); 
} 

這裏有一個演示：http://jsfiddle.net/M7hT8/1/

最初基於daveyfaherty的解決方案。 我知道這個問題是前一陣子，但我分享我的解決方案，任何人通過搜索發現這一點。

Answer 4

//last mouse coordinate 
var mouseX = 0; 
//epsilon interval 
var mouseEps = 10; 

function mouseDownHandler(e) { 
    e.preventDefault(); 
    mouseX = e.clientX; 
}; 

function mouseUpHandler(e) { 
    e.preventDefault(); 
    if (Math.abs((mouseX - e.clientX)) < mouseEps) { 
     clickHandler(e); 
    } 
}; 

function clickHandler(e) { 
};