在按钮上交替播放音频单击Javascript 第一次单击:播放音频1 第二次单击:播放音频2 第三次单击:返回音频1

在按钮上交替播放音频单击Javascript 第一次单击:播放音频1 第二次单击:播放音频2 第三次单击:返回音频1,javascript,audio,Javascript,Audio,等等 这是我的HTML2音频和按钮 <audio id="breatheIn" src="breathIn.mp3"></audio> <audio id="breatheOut" src="breathIn.mp3"></audio> <button class="Breather"id="Breather" value=

等等

这是我的HTML2音频和按钮

<audio id="breatheIn" src="breathIn.mp3"></audio>
<audio id="breatheOut" src="breathIn.mp3"></audio>
<button class="Breather"id="Breather" value="Inhale">Inhale</button>

吸入

您需要设置一个开关变量,当单击按钮时,该变量将在true和false之间切换。然后可以使用if…else语句来检测变量的状态。如果为真,则播放第一个音频。如果为false,则播放另一个,依此类推。

我的解决方案:

<script>
            var startButton = document.getElementById("Breather");
            var track1 = document.getElementById("audio1");
            var track2 = document.getElementById("audio2");
            var status1 = document.getElementById("playStatus1");
            var status2 = document.getElementById("playStatus2");
            var currTrack = document.getElementById("currTrack");
            
            var play1 = true;
            var started = false;
       
            startButton.onclick = function(){
              if(play1 == true){
                track2.currentTime = 0;
                track2.pause();
                track1.play();
                status2.innerHTML = "stopped"
                status1.innerHTML = "playing";
                currTrack.innerHTML = "Track 1";
                play1 = false;
              }

              else if (play1 == false){
                track1.currentTime = 0;
                track1.pause();
                status1.innerHTML = "stopped";
                status2.innerHTML = "playing";
                track2.play();
                currTrack.innerHTML = "Track 2";
                play1 = true;
                
              }       
            }
    
          </script>```

var startButton=document.getElementById(“呼吸器”);
var track1=document.getElementById(“audio1”);
var track2=document.getElementById(“audio2”);
var status1=document.getElementById(“playStatus1”);
var status2=document.getElementById(“playStatus2”);
var currTrack=document.getElementById(“currTrack”);
var play1=真;
var=false;
startButton.onclick=函数(){
如果(播放1==真){
track2.currentTime=0;
track2.pause();
track1.play();
status2.innerHTML=“已停止”
status1.innerHTML=“播放”;
currTrack.innerHTML=“Track 1”;
play1=假;
}
else if(play1==false){
track1.currentTime=0;
track1.pause();
status1.innerHTML=“已停止”;
status2.innerHTML=“播放”;
track2.play();
currTrack.innerHTML=“轨道2”;
play1=正确;
}       
}
```