jsを使用してオーディオを再生する

Question

ボタンを使用してオーディオトラックをブラウザで再生する1の2に変更しようとしていますが、見つかった方法は2番目のトラックに切り替わりますが、その後、2番目のトラックだけが再開されます。ここに私のコードです：

function loadSong(){ 
    var player=document.getElementById('player'); 
    var source1=document.getElementById('player'); 
    var source2=document.getElementById('player'); 

    source1.src='/audio/mac+.mp3'; 
    source2.src='/audio/mac-slowed.mp3'; 

    player.load(); //just start buffering (preload) 
    player.play(); //start playing 
} 

HTML

<audio id="player" autoplay="autoplay" preload="auto" loop="loop"> 
    <source id="source1" src="/audio/mac+.mp3" type="audio/mpeg"> 
    <source id="source2" src="" type="audio/mpeg"> 
</audio> 
<button onclick='loadSong()'>Switch the Music!</button> 

Answer 1

オリジナルのお問い合わせに記載されている情報に基づいて、これが最適です。あなたにはJSFiddleが添付されています。 srcファイルをローカルに保存された独自のファイルで更新する必要があります。

HTML：

<audio id="source1" autoplay="autoplay" loop="loop" src='http://www.stephaniequinn.com/Music/Allegro%20from%20Duet%20in%20C%20Major.mp3'></audio> 
<audio id="source2" loop="loop" src='http://www.stephaniequinn.com/Music/Pachelbel%20-%20Canon%20in%20D%20Major.mp3'></audio> 
<button id="player">Switch the music to track # 2</button> 

Javascriptを：

var player = document.getElementById('player'); 
var source1 = document.getElementById('source1'); 
var source2 = document.getElementById('source2'); 

player.onclick = function() { 
    curTrack = this.innerHTML.replace(/Switch the music to track # /, ""); 
    if (curTrack == "1") { 
    nextTrack = "2"; 
    source1.play(); 
    source2.pause(); 
    source2.currentTime = 0; 
    } else { 
    nextTrack = "1"; 
    source2.play(); 
    source1.pause(); 
    source1.currentTime = 0; 
    } 
    this.innerHTML = "Switch the music to track # " + nextTrack; 
} 

Answer 2

あなたはあなたのコードあなたがソース1、ソース2そうsource1にソース1のセレクタを変更するには、同じセレクタを保存しているの#player要素の外観を上書きされており、 source2