區分mouseup mousedown和點擊

我知道，當用戶按下鼠標按鈕時會發生mousedown，當釋放鼠標並點擊鼠標當然發生兩個事件mousedown和mouseup時會發生mouseup。我有三個不同的事件，每個處理這三個事件mouseup down並單擊。我的問題是如何區分這三個，現在我的鼠標下來有一個計時器，所以我想在該計時器中添加一個布爾值，並在點擊內測試它，我試過這個，它不符合我的標準。區分mouseup mousedown和點擊

某些類別Mousedown-計時器檢查然後，如果沒有這些類的靶向元件中存在繼續

Mouseup-清零定時器

點進打開一個模塊

我可能還沒有作出布爾型的全局變量，每個都可以讀取或不可以，或者我完全缺少某些東西。這裏是我的完整代碼的示例快速代碼

var isDown = false; 
ee[i].addEventListener('click',function(){ 
    if(isDown===false){ 
    openModule(); 
    } 
    },false); 

ee[i].addEventListener('mousedown',function(){ 
    var timer; 
    var $this = this; 
    timer = setTimeout(function(){ 
    if($this.className == "class"){ 
    isDown=true; 
    createActive(); 
    } 
    },500); 
},true); 

    ee[i].addEventListener('mouseup',function(){ 
    clearTimeout(timer); 
    },false);

這只是一個簡單的例子。我可能錯過了一些編碼，但我希望你能在上面的代碼中發現我的偏見。任何人都知道區分這三個事件的好方法嗎？

來源

2013-10-25 EasyBB

我已經重寫利用jQuery的代碼......

var isDown = false; 
var timer; 

$('.class').mousedown(function(){ 
    isDown = false; 
    timer = setTimeout(function(){ 
     isDown = true; 
     //createActive(); 
      console.log('MOUSE DOWN'); 
    }, 500); 
}).mouseup(function(){ 
    if(isDown === false){ 
     //openModule(); 
      console.log('CLICK'); 
    }else{ 
      console.log('MOUSE UP'); 
    } 
    clearTimeout(timer);  
});

如果您只需添加的jQuery到您的網頁，我的代碼會自動依附任何元素在文檔中使用的一類「類」的。

我已經註釋掉了你的createActive（）;和openModule（）;調用以便您可以隨時使用它（在運行時查看您的javascript控制檯會顯示腳本正在運行 - 當您完成播放時，請移除console.log（）內容）。這段代碼可以進一步優化，但它會給你一個總體思路。

您的計時器變量需要全局創建（我將其移出該函數）。

在這種情況下（聲明一個mousedown時間障礙），click函數將變得無用，所以我將它簡化爲mouseup函數。

很高興知道核心的JavaScript，但jQuery太簡單而且功能強大，無法忽略。

來源

2013-10-26 03:24:49 JxAxMxIxN

哈哈，我沒有使用jQuery，所以爲什麼我沒有寫jQuery作爲標籤;）我也習慣使用jQuery很多，雖然在回顧了很多jQuery庫之後，我可能不會使用它。在這裏和那裏都可以，知道Vanilla如何爲我編寫的代碼實例化，比如20ms，而jQuery將會像1000ms一樣只是一個數字，但仍然是一件很棒的事情。我看到你做了什麼，所以我會把它改成香草，如果我把它做得很好，我會添加我是如何創建的。 – EasyBB

是的，它會非常容易unjQuery它。只需改變「$（'。class'）。mousedown（」回到「ee [i] .addEventListener（'mousedown'，」並且對mouseup部分執行相同的基本操作，我寫了一個無jQuery的問題，但遇到了一個問題（可能是因爲我理解你的目標更好一些），並且不想再花時間計算出它。 jQuery在編碼器上非常簡單，雖然它的運行速度可能會缺乏（可以'確認或否認），只要你不使用大量複雜的代碼來使用戶系統死亡，結果就是值得的。 – JxAxMxIxN

不，你是對的，代碼是很長的，而不是使用jQuery，我決定使用JavaScript（香草），因爲它是我的輕量級選項與jQuery相比，它不會吃用戶系統，但用jQuery你會有做很多不必要的事情來完成代碼的功能。特別是對於我鄙視lol的jQuery。我會標記你的答案是正確的，因爲你是唯一的答案，並且它足夠接近我去除了jQuery以外的地方;） – EasyBB

區分mouseup mousedown和點擊

回答

相關問題