javascript中的蓝牙耳机按钮事件检测

Question

我正在构建一个网络应用程序，我可以在其中检测耳机按钮事件。我在插入耳机时成功捕获了耳机按钮事件。现在我正在尝试捕获蓝牙耳机的下一个按钮事件。请问有什么帮助吗？

耳机按键检测代码。

 document.addEventListener('volumeupbutton', () => {
   //Do something here
 }, false);

我需要类似的东西。

Answer 1

您可以使用keydown and keyup 事件来实现长按功能。

// Imprementation of Long Press

const longPressTime = 1500;
let keyDownTimeout;
document.addEventListener('keydown', e => {
  if (keyDownTimeout) {
    return;
  }
  keyDownTimeout = setTimeout(() => {
    // button was held for 1500ms, consider it a long-press
    if (e.code === 'ArrowUp') {
      console.log("Action Performed");
      // do long-press action
    } else {
      console.log("Other action performed");
    }
  }, longPressTime);
});

document.addEventListener('keyup', e => {
  clearTimeout(keyDownTimeout);
  keyDownTimeout = 0;
});

Press any key

以上方法适用于单键长按。请参阅KeyCode 获取密钥代码。 Demo of above

Answer 2

我不相信使用内置的 volumeupbutton 事件可以让您检测点击的时间长短，以确定是否应将其视为提高音量或跳过曲目。相反，您应该能够使用 keyup/keydown 事件，结合 keyCode 属性来确定它是否是音量按钮，如下所示：

const longPressTime = 1500;
let volumeUpButtonTimeout;
const volumeButtonKeyCode = 0; // you'll need to determine the key code

// cross platform way to get the key code
const getKeyCode = e => {
  if (e.key !== undefined) {
    return e.key;
  } else if (e.keyIdentifier !== undefined) {
    return e.keyIdentifier;
  } else if (e.keyCode !== undefined) {
    return e.keyCode;
  }
}

document.addEventListener('keydown', e => {
  if (getKeyCode(e) == volumeButtonKeyCode) {
    volumeUpButtonTimeout = setTimeout(() => {
      // button was held for 1500ms, consider it a long-press
      // do long-press action
    }, longPressTime)
  }
});

document.addEventListener('keyup', e => {
  if (getKeyCode(e) == volumeButtonKeyCode) {
    clearTimeout(volumeUpButtonTimeout);
  }
});

您可以使用此代码来确定哪个 keyCode 对应于音量增大按钮：

document.addEventListener('keyup', e => {
  console.log(e.keyCode);
});