Javascript，单击，双击并拖动到相同的元素中

我需要一个函数来计算用户是否单击，双击或拖动鼠标。Javascript，单击，双击并拖动到相同的元素中

因为这一切都发生在相同的画布使用正常事件不起作用。我通过谷歌发现了这一点：

将处理程序绑定到同一元素的click和dblclick 事件是不可取的。触发事件的顺序从浏览器到浏览器变化为，其中一些接收两个点击事件，另外一些事件只有一个事件发生。如果无法避免对单一反应产生不同反应的界面和双击，则应在点击处理程序中模拟dblclick事件。我们可以通过在处理程序中保存时间戳，然后将当前时间与保存的时间戳进行比较来实现此目的。如果差别很小，我们可以将点击视为双击。

我该如何实现这个好方法？

首先看看点击是否被按下（拖动）？当它发布时把它当作点击？然后如果再次单击双击？

如何将此代码翻译成代码？帮助赞赏。

来源

2012-03-30 justanotherhobbyist

可以链接到你的来源？ – zzzzBov 2012-03-30 20:49:21

这是我想使用它的地方，点击位于脚本的底部（仅单击atm）。 http://jsfiddle.net/hustlerinc/EkWyZ/ – justanotherhobbyist 2012-03-30 20:51:19

类似下面应该让你开始，我使用jQuery只是为了更加方便地显示，这可以用直JS来实现，它只是一个很大的噪音

$(function() { 

    var doubleClickThreshold = 50; //ms 
    var lastClick = 0; 
    var isDragging = false; 
    var isDoubleClick = false; 

    $node = ("#mycanvas"); 
    $node.click(function(){ 
    var thisClick = new Date().getTime(); 
    var isDoubleClick = thisClick - lastClick < doubleClickThreshold; 
    lastClick = thisClick; 
    }); 

    $node.mousedown(function() { 
    mouseIsDown = true; 
    }); 

    $node.mouseUp(function() { 
    isDragging = false; 
    mouseIsDown = false; 
    }); 

    // Using document so you can drag outside of the canvas, use $node 
    // if you cannot drag outside of the canvas 
    $(document).mousemove(function() { 
    if (mouseIsDown) { 
     isDragging = true; 
    } 
    }); 
});

来源

2012-03-30 21:02:17

是上面的代码jQuery？想象一下$ -sign。 – justanotherhobbyist 2012-03-30 21:05:57

是的，它是jQuery，但这只是让我不必污染与额外的代码，使其跨浏览器工作的职位。这并不意味着你要剪切和粘贴，只是为了让你看到逻辑 – 2012-03-30 21:06:55

是的，我知道我必须编辑它，只是想确保我正确地阅读代码。我会尽力翻译它=） – justanotherhobbyist 2012-03-30 21:18:37

我可能会通过在点击事件中添加一个计时器来检查另一次点击来解决这个问题。

time = 0 
if(new Date().getTime() < time + 400) { 
    // Double click 
    throw new Error("Stop execution"); 
} 
if(!!time) 
    throw new Error("Stop execution"); 
time = new Date().getTime(); 
// Single click

就是这样的。未经测试，由于某种奇怪的原因，我现在无法想象。

来源

2012-03-30 20:46:29 Mizuho

Javascript，单击，双击并拖动到相同的元素中

回答

相关问题