Question

我有一个简单的程序，如：

<div onclick="handleClick(event)" ondblclick="handleDoubleClick(event)">
  Hellooww world
</div>
<script>
    var a = false
    function handleClick(e) {
    if(a) {
        a = false
            console.log("Hellooww", a)
    }else{
        a = true
      console.log("Hellooww", a)
    }
    }

  function handleDoubleClick(e) {
    console.log("world")
  }
</script>

这里单击它会将a的值设置为true为false ..但是当它双击时，它会同时执行单击和双击

如何只检查单击并双击

Answer 1

This thread提供了行为发生原因的详细信息，但这是您特定用例的解决方案。一种可能的方法是使用timeout和一些等待时间。问题是没有标准的等待间隔。虽然您可以使用300 ms时间a mobile browser uses来区分tap和double tap事件：

var a = false;
var timeout;
function handleClick(e) {
    timeout = setTimeout(function () {
        if (a) {
            a = false
            console.log("Hellooww", a)
        } else {
            a = true
            console.log("Hellooww", a)
        }
    }, 300);
}

function handleDoubleClick(e) {
    if (timeout) {
        clearTimeout(timeout);
    }
    console.log("world")
}

但通常，不要在同一元素上注册click和dblclick事件：无法正确区分单击事件和导致dblclick事件的单击事件。

javascript区分单击和双击

1 个答案: