判断移动端手指滑动

话不多说 code time

const target = document.getElementById('sidebar-open');
let startX, startY;

function handleStart(e) {
  startX = e.touches[0].clientX || e.clientX;
  startY = e.touches[0].clientY || e.clientY;
}

function handleEnd(e) {
  const endX = e.changedTouches[0].clientX || e.clientX;
  const endY = e.changedTouches[0].clientY || e.clientY;
  const diffX = startX - endX;
  const diffY = startY - endY;

  if (Math.abs(diffX) > Math.abs(diffY) && Math.abs(diffX) > 5) { // 5是一个敏感度的阈值，用来避免误判
    target.classList.remove('sidebar-open');
  }
}

target.addEventListener('touchstart', handleStart);
target.addEventListener('touchend', handleEnd);

此代码稍加改造亦可对鼠标划入划出等进行判断 本案例为判断左滑