首頁 >web前端 >js教程 >jQuery:mousedown與click衝突事件

jQuery:mousedown與click衝突事件

黄舟
黄舟原創
2017-06-28 09:23:212992瀏覽

滑鼠事件,一般用button來區分滑鼠的按鍵(DOM3標準規定: click事件只能監聽左鍵, 只能透過mousedown和mouseup來判斷滑鼠鍵):

1.滑鼠左鍵button = 0

2.滑鼠右鍵button = 2

3.滑鼠滑輪button = 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');
    }
}

解決mousedown和click的之間的衝突 (利用事件發生時間判斷點選事件時間短)

<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與click衝突事件的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn