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

How to apply long click event and doubleclick event on the same element in javascript

本文关键字：事件 应用 单击 元素 双击 javascript      更新时间：2023-09-26

我有一个元素（textArea）。现在我想要一个长按事件和一个双击元素的事件。我能够做到这一点，但我也想在长按事件的鼠标关闭事件中使用 event.preventDefault（）。这反过来又会阻止 dblClick 事件。

我想阻止默认的原因是我在长按上渲染一个元素，并希望在长按后触发鼠标移动时阻止初始鼠标向下。我已经搜索并重新搜索了网络，但找不到解决长按和dblclick同一元素问题的好答案。

谢谢！！

试试这个演示

.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');
}
相关文章：