수다닷컴

드래그할 때 a 태그 이동 막는 방법

니지 2026.04.22 댓글 4

터치 슬라이드를 구현하면서 마우스 드래그 이벤트를 적용했는데요.
드래그를 마치면 a 태그 링크로 이동해 버립니다.
mousemove에서 click 이벤트에 preventDefault를 적용하면 링크 이동은 막히지만, 드래그가 끝난 뒤 일반 클릭도 작동하지 않아요.
드래그일 때만 링크 이동을 막으려면 어떻게 해야 하나요?

댓글 4

  • 아잉누님 2026.04.22

    상황을 조금 더 설명하면 ul에 이벤트를 적용했는데 잘 안 되네요ㅠㅠ

  • 핫체리 2026.04.22

    이런 식으로 처리하면 될 것 같아요.
    마우스 업 시 드래그인지 확인한 뒤, 드래그라면 기본 동작을 막고 클릭이라면 그대로 두면 됩니다.

  • 알찬바로 2026.04.22

    그런데 preventDefault를 적용하면 다음부터 이미지를 감싼 a 태그가 작동하지 않아요ㅠㅠ

  • 채꽃 2026.04.22

    마우스를 누를 때 시작 좌표를 저장하고, 움직일 때 좌표를 기록해 보세요.
    마우스를 뗄 때 두 좌표의 차이가 일정 거리 이상이면 드래그로 보고, 그렇지 않으면 클릭으로 처리하면 될 것 같아요~