mousedown、mouseup、click事件之間的關係及執行順序

 

三個事件的觸發時機

mousedown

當鼠標指針移動到元素上方，並按下鼠標按鍵（左、右鍵都可）時，會發生 mousedown 事件。
與 click 事件不一樣，mousedown 事件僅須要按鍵被按下，而不須要鬆開便可發生。

mouseup

當在元素上鬆開鼠標按鍵（左、右鍵都可）時，會發生 mouseup 事件。
與 click 事件不一樣，mouseup 事件僅須要鬆開按鈕。當鼠標指針位於元素上方時，放鬆鼠標按鈕就會觸發該事件。

click

當鼠標指針停留在元素上方，而後按下並鬆開鼠標左鍵時，就會發生一次 click 事件。
注意：觸發click事件的條件是按下並鬆開鼠標左鍵！，按下並鬆開鼠標右鍵並不會觸發click事件。

三個事件的觸發順序

• 若在同一個元素上按下並鬆開鼠標左鍵，會依次觸發mousedown、mouseup、click，前一個事件執行完畢纔會執行下一個事件
• 若在同一個元素上按下並鬆開鼠標右鍵，會依次觸發mousedown、mouseup，前一個事件執行完畢纔會執行下一個事件，不會觸發click事件