>  기사  >  웹 프론트엔드  >  jQuery: mousedown 및 클릭 충돌 이벤트

jQuery: mousedown 및 클릭 충돌 이벤트

黄舟
黄舟원래의
2017-06-28 09:23:212945검색

Mouseevent, 일반적으로 버튼을 사용하여 마우스 버튼을 구분합니다(DOM3 표준에서는 클릭 이벤트가 왼쪽 버튼만 모니터링할 수 있고 mousedown 및 mouseup을 통해서만 마우스 버튼을 판단할 수 있음):

1.

2. 마우스 오른쪽 버튼 버튼 = 2

3. 마우스 휠 버튼 = 1

p.onmousedown = function (e) {
    var event = e || window.event;
    if(event.button == 2){
        console.log('right');
    }else if(event.button == 0){
        console.log('left');
    }
}

마우스다운과 클릭의 충돌 해결(이벤트 시간을 이용하여 클릭 이벤트가 짧은지 확인)

<span style="color: #000000">var key = false;//设置了一个标志 false为点击事件 ture为鼠标移动事件
var firstTime = 0;
var lastTime = 0;
p.<a href="http://www.php.cn/wiki/1449.html" target="_blank">onclick</a> = function() {
    if(key){
        console.log(&#39;click&#39;);
        key = false;
    }
}
p.onmousedown = function() {
    firstTime = new Date().getTime();
    console.log(&#39;mouseDown&#39;);
}
p.<a href="http://www.php.cn/wiki/1459.html" target="_blank">onmouseup</a> = function() {
    console.log(&#39;mouseUp&#39;);<br/>//鼠标抬起后 记录时间 超过200ms就是移动事件
    lastTime = new Date().getTime();
    if( (lastTime - firstTime) </span><span style="color: #0000ff"><</span><span style="color: #800000"> 200</span><span style="color: #ff0000">){
        key </span><span style="color: #0000ff">= true;    </span><span style="color: #ff0000">}
}</span>

위 내용은 jQuery: mousedown 및 클릭 충돌 이벤트의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.