當一鼠屁為極品，多鼠屁則可稱之為天堂。

圖片來源：我
雖然沒有很多倉鼠屁屁，倒是可以多摸幾下。

本篇將續紀錄鼠輩事件之buttons屬性。

鼠輩事件之buttons屬性

任何鼠輩事件發生之當下，其buttons屬性之值表事件發生同時有何點按處處於受點按之狀態。

規範原文：
During any mouse events, buttons MUST be used to indicate which combination of mouse buttons are currently being pressed, expressed as a bitmask.

不同點按處於鼠輩事件發生之同時處於受點按之狀態，其與buttons屬性之值之關係如下：
值為0，表無任何點按處受點按
值為1，表主要點按處，通常為左處
值為2，表次要點按處，通常為右處
值為4，表輔助點按處，通常為中央頭頂處，附有滾動功能

而buttons屬性之值則為點按處代表之值之總和。
例如，鼠輩事件發生之同時，主要點按處與次要點按處皆處於受點按之狀態，則buttons屬性之值即為 1+2=3。

以下示例挪用先前篇章紀錄之愛鼠祭壇術式，並改以取用buttons屬性改造。

先前之篇章定義變數isPressed，以紀錄鼠輩點按之狀態。其初始值為false，當鼠輩點按時更改為true，放開鼠輩時則更改為false。

let isPressed = false;

function touchSeven(event) {
  isPressed = true;

  // ...
}

function getTotalLove() {
  isPressed = false;

  // ...
}

seven.addEventListener("mousedown", touchSeven);
seven.addEventListener("mouseup", getTotalLove);

而實際需判斷當下鼠輩是否受點按之處為函式之術名giveLove，因此更改giveLove之內容，當鼠輩事件buttons屬性之值為1時給予愛心。為觀察buttons屬性之值，亦在操術板印出當下buttons屬性之值。

function giveLove(event) {
  // ...

  if (event.buttons === 1 && reduceCondition) {
    showLoveBubble(square, event);
    loveValue++;
  }

  console.log(event.buttons);
}

即可完成相同之愛鼠祭壇，僅有鼠輩左處點按之同時移動鼠輩可給予愛心。

愛鼠祭壇2.0

需注意勿將buttons與button混淆。

示例之術式

https://github.com/CReticulata/2024ithome/tree/main/Day13

翻譯

鼠輩：滑鼠
點按處：按鍵
左處：左鍵
右處：右鍵
中央頭頂處：滾輪按鈕

相關連結

• buttons - w3.org