如何在javascript中的同一元素上应用长按事件和双击事件

时间:2013-10-23 10:36:12

标签: javascript html events

我有一个元素(textArea)。现在我想在元素上进行长按事件和双击事件。我能够做到这一点,但我也想在长按事件的mousedown事件中使用event.preventDefault()。这反过来也会阻止dblClick事件。

我想要preventDefault的原因是我在longPress上渲染一个元素,并希望阻止初始mouseDown,因为我在longpress之后触发了mousemove。我已经搜索并重新搜索了网络,但我找不到一个好的答案,解决了长按和dblclick相同元素的问题。

谢谢!

1 个答案:

答案 0 :(得分:3)

试试 Demo

<强> HTML

<input type="button" ondblclick="whateverFunc()" onmousedown="func(event)" onmouseup="revert()" value="hold for long"/>

<强>的JavaScript

var timer;
var istrue = false;
var delay = 3000; // how much long u have to hold click in MS
function func(e)
{
   istrue = true;
   timer = setTimeout(function(){ makeChange();},delay);
  // Incase if you want to prevent Default functionality on mouse down
  if (e.preventDefault) 
  { 
     e.preventDefault();
  } else {
     e.returnValue = false; 
  }
}

function makeChange()
{
      if(timer)
      clearTimeout(timer);

      if(istrue)
      {
            /// rest of your code
          alert('holding');

      }
}
function revert()
{
   istrue =false;
}
function whateverFunc()
{
    alert('dblclick');
}