JavaScript MouseMove 이벤트 속성

Question

MouseMove 이벤트에 대한 Mozilla 문서 페이지를 읽었습니다.
속성 테이블에는 작동 방식을 이해할 수없는 2 가지 속성이 있습니다.

세부 사항 설명 : "짧은 시간 내에 발생한 연속 클릭 수를 1 씩 증가시킵니다."

모질라가 연속으로 생각하는 것, 클릭 수 사이의 시간 간격. 더 짧거나 더 오랫동안 구성 할 수 있습니까?

버튼 설명 : "마우스 이벤트가 발생하면 눌려진 버튼"으로 통계를 나타냅니다.

누름 버튼이란 무엇입니까? mouseup 이벤트의 버튼 상태입니까?
이 단계 또는 상태에 대한 언급이 mouseup event이나 mousedown event 인 이유는 무엇입니까?

Answer 1

details 속성은 짧은 시간 내에 클릭 수를 제공합니다. "짧은 시간"은 더블 클릭이 유효한 입력이되는 기간입니다. 특정 경우에 마우스 위로 요소를 이동하면 일련의 mousemove 이벤트가 발생하지만 mousemove 이벤트는 세부 정보 속성을 무시합니다. 마우스를 움직여서 클릭하면 많은 의미가 없습니다. click 이벤트로 시도해 보면 어떻게 작동하는지 확인할 수 있습니다. 더블 클릭의 작은 기간이 감지 될 때까지

md.addEventListener("click", e => console.log(e.detail));

#md { 
 
    width: 300px; 
 
    height: 200px; 
 
    text-align: center; 
 
    background-color: thistle; 
 
}

<div id="md">Click</div>

는 클릭 수를 계산합니다. 운영 체제 마우스 인터페이스에서이 시간을 변경할 수 있습니다.

buttons 속성은 MDN에서 매우 명확하게 설명됩니다. 마우스 이벤트가 발생되었을 때 우울

버튼 : 왼쪽 버튼 = 1, 오른쪽 버튼 = 2, 중동 (휠) 버튼 = 4, 4 버튼 (일반적으로, "브라우저 뒤로"버튼) = 8, 다섯 번째 버튼 (일반적으로 "브라우저 앞으로" 버튼) = 16. 두 개 이상의 버튼이 눌려진 경우 논리 값 합계를 반환합니다. 왼쪽 버튼과 오른쪽 버튼을 누른 경우 예를 들어, 3

그것은 당신에게 부여합니다 반환 버튼 (들)는 특정 마우스 이벤트가 발생이있을 때 누르면. 이번에는 mousemove 이벤트에서 의미가 있습니다. 그 이유는 위의 MDN에서 설명한대로 버튼 번호를 제공하기 때문입니다.