A-Frame 通过点击相同的元素来播放和暂停声音

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(); 
    });

为了更好地理解，我在这里复制了这种情况，我可以点击红色方块并播放声音，然后再次点击同一个方块并使其停止

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

Answer 1

尝试暂停声音。

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

或者

sound.components.sound.pauseSound();

保留一个布尔值以了解是播放还是暂停。

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

Answer 2

谢谢你！你也救了我，你的建议对我来说很管用。

亲爱的Evoinsec 我能与你产生如此多的共鸣，并且在 ngokevin 的帮助下很幸运。所以在这里我提供了我的一部分代码。

这是HTML https://aframe.io/releases/0.3.0/aframe-inspector.min.js">

    <a-marker preset="hiro">

        <!--This is to Start/Pause audio-->
        <a-image id="audio"
                 src="./img/bird.jpg"
                 width="1" height="1"
                 position="1 0 0"
                 rotation="90 0 -90"
                 sound="src:./sound/bird.mp3"></a-image>
     </a-marker>


    <a-entity camera>
        <a-entity id="myCursor" 
                  cursor="fuse:true; maxDistance:30; timeout:500;" 
                  scale="0.03 0.03 0.03" 
                  position="0 0 -2" 
                  geometry="primitive: ring" 
                  material="color: red; shader: flat; opacity:0.5">
        </a-entity>
    </a-entity>
   </a-scene>
</body>

这是.js 函数初始化（）{ document.getElementById('audio').addEventListener('click', audioControle, false); }

function audioControle() { //SOUND STATUS
  var sound = document.querySelector('#audio');
  if (isPlaying == true) {
    // Do pause.
    sound.components.sound.pauseSound(); 
    isPlaying = false;
  } else if (isPlaying == false){
    // Do play.
    sound.components.sound.playSound(); 
    isPlaying = true;
  }
init();
}

这可能不是最聪明的方法，但对我有用。希望对你有帮助。

A-Frame 通过点击相同的元素来播放和暂停声音

A-Frame Play and pause a sound by clicking on the same element

javascript

aframe