javascript - A 框架 通过单击同一元素来播放和暂停声音

Question

我试图通过单击同一个元素来播放和暂停声音，我能够播放它，但无法暂停它并在每次单击时再次播放，我为此使用了 javascript。

这是我到目前为止所拥有的:

HTML

<a-image id="statue" src="#audio_logo" width="1.5" height="1.5" position="-27 7 -4" rotation="0 90 0" sound="src:#museumSound"> </a-image>

Javascript

  var sound = document.querySelector('#statue');
    sound.addEventListener('click', function () {
    sound.components.sound.playSound(); 
    });

在这里，我复制了这种情况以便更好地理解，我如何能够单击红色方 block 并播放声音，然后再次单击同一方 block 并使其停止

https://codepen.io/EdgarJF/pen/jwdOZr

Answer 1

尝试暂停声音。

document.querySelector('#museumSound').pause();

或者

sound.components.sound.pauseSound(); 

保留一个 bool 值来知道是播放还是暂停。

var isPlaying = false; 
if (isPlaying) {
  // Do pause.
  isPlaying = false;
} else {
  // Do play.
  isPlaying = true;
}