双击事件不触发单击事件

在双击事件中，单击事件会自动被触发两次，因此需要在双击事件中阻止单击事件的触发。可以通过以下两种方式来实现：

1. 使用setTimeout函数延迟触发单击事件，在双击事件中清除该定时器，从而阻止单击事件的触发。

let clickTimer;
element.addEventListener('click', function() {
  clickTimer = setTimeout(function() {
    // 单击事件的处理逻辑
  }, 300); // 延迟300毫秒触发单击事件
});

element.addEventListener('dblclick', function() {
  clearTimeout(clickTimer); // 清除单击事件的定时器
  // 双击事件的处理逻辑
});

2. 在双击事件中判断当前是否已经触发了单击事件，如果已经触发，则不再触发单击事件。

let clickFlag = false;
element.addEventListener('click', function() {
  clickFlag = true;
  setTimeout(function() {
    if (clickFlag) {
      // 单击事件的处理逻辑
    }
    clickFlag = false;
  }, 300); // 延迟300毫秒触发单击事件
});

element.addEventListener('dblclick', function() {
  if (clickFlag) {
    // 已经触发了单击事件，不再触发
    clickFlag = false;
    return;
  }
  // 双击事件的处理逻辑
});