當點擊按鈕時播放音頻，然後停止播放，並在點擊不同按鈕時播放新音頻

Question

當用戶點擊丁字音樂播放音頻時，但當他們點擊另一個音頻停止的按鈕時，它會播放該按鈕等音頻向前。在頁面加載的那一刻，我也有自動播放的背景音樂，我試圖找出如何在按下新按鈕時停止播放音樂，然後按照當前重疊的方式播放音樂。任何幫助將不勝感激。

負載背景音樂代碼：

<audio autoplay="autoplay" class="bondAudio"> 
    <source src="audio/Bond.mp3" type="audio/mpeg"> 
    Your browser does not support the audio element. 
</audio> 

按鈕點擊音頻播放代碼：

<script> 
    $(document).ready(function() { 
     var audioElement = document.createElement('audio'); 
     audioElement.setAttribute('src', 'audio/Dr-No.mp3'); 
     audioElement.setAttribute('play', 'play'); 
     //audioElement.load() 

     $.get(); 

     audioElement.addEventListener("load", function() { 
      audioElement.play(); 
     }, true); 

     $('#blockLink1').click(function() { 
      audioElement.play(); 
     }); 
    }); 
</script> 

Answer 1

使用，當你有jQuery的純JS你爲什麼要創建元素？

<script> 
    $(document).ready(function() { 
     var audioElement = $('<audio></audio>'); 

     audioElement.attr('src', 'audio/Dr-No.mp3'); 
     audioElement.attr('play', 'play'); 
     //audioElement.load() 

     $.get(); // ? 

     audioElement.on("load", function() { 
      audioElement.get(0).play(); 
     }, true); 

     $('#blockLink1').click(function() { 
      $('audio').each(function() { 
       this.stop(); 
      }); 
      audioElement.get(0).play(); 
     }); 
    }); 
</script>