通过两个按钮在两个片段之间切换音频

时间:2018-12-02 17:20:10

标签: button audio switching

我尝试放置此代码,但问题是第二个按钮没有

     var button = document.getElementById("controls");
     var track1 = document.getElementById("audio1");
     var track2 = document.getElementById("audio2");

     button.onclick = function(){
       currTrackNo = this.innerHTML.replace(/Play track /, "");
       nextTrackNo = (currTrackNo == "1")? "2" : "1";
       this.innerHTML = "Play track " + nextTrackNo;

       if (currTrackNo == "1"){
         track1.play();
         track2.pause();
       } else {
         track2.play();
         track1.pause();
       }
     }
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Toggle sound clips</title>
  </head>

  <body>
    <audio id="audio1" src="1.mp3"></audio>
    <audio id="audio2" src="2.mp3"></audio>
    <button id="controls">Play track 1</button>
    <button id="controls">Play track 1</button>

我尝试放置此代码,但问题是第二个按钮没有

1 个答案:

答案 0 :(得分:0)

每个标签的

Id应该是唯一的。尝试将第二个按钮的id更改为其他内容。然后通过其新ID获取对该按钮的引用。之后,为第二个按钮设置正确的操作。
您可能想查看this link,它详细说明了id属性。