2011-12-21 137 views
2

我正在使用jQuery编写事件处理程序,并且对点击和双击事件有疑问。我有一个带有“文件”类的元素。它有两个事件处理程序,一个用于单击元素,另一个用于双击。我希望两个都独立于另一个触发,但是当双击事件发生时,总会触发click事件。单击并双击事件触发

$('.file').live('dblclick', function(//event handler code){}); 
$('.file').live('click', function(//event handler code){}); 

当用户双击附加了事件的项目时,应该触发双击事件,这是正常的。但是,似乎任何单击事件也会触发。在jQuery中,如果双击事件触发,这是否意味着单击事件一直在同一元素上触发?

+0

是的,没有办法很好地改变它。没有一个点击,怎么会有双击? – 2011-12-21 21:43:47

+0

可能重复[如何区分单击事件和双击事件?](http://stackoverflow.com/questions/5497073/how-to-differentiate-single-click-event-and-double-click-event) – 2011-12-21 21:54:19

回答

4

正如詹姆斯在他的评论中提到的那样,没有另一个就不可能有一个。这将是一个黑客,但你可以让这些工作与计时器独立工作:

$('.file').live('dblclick', function() { 


    $(this).data('doubleClicked', true); 
    //event handler code 

}); 

function SingleClickHandle(this) 
{ 
    if (! $(this).data('doubleClicked')) 
    { 
    //event handler code 
    } 
} 

$('.file').live('click', function(){ 

    $(this).data('doubleClicked', false); 
    setTimeout('SingleClickHandler(this)', 500); // is half a second enough to consider it a double-click? 

}); 
+1

什么是“睡眠”? – 2011-12-21 21:54:39

+0

追加到@ AndrewWhitaker的评论:这不是PHP!使用'setTimeout'。 – 2011-12-21 21:59:31

+0

woops,是啊写得太快。 – 2011-12-21 22:22:09

-2

不相信第一个答案,那真的很糟糕。 使用这个来代替:

$('.file').on('click', function() 
{ 
    $(this).css('background', 'blue'); 
}); 

$('.file').on('dblclick', function(event){ 
    event.preventDefault(); 
    $(this).css('background', 'green');        
}); 

http://jsfiddle.net/H42KV/

+2

也许你可以解释什么是“真的很糟糕”... – 2013-01-31 10:48:55

+1

点击事件仍然触发双击,至少在Chrome中。 – 2013-11-25 21:43:53