2012-02-23 9 views
19

他のソリューションは1つしか見つかりませんでしたが、不完全なのでここで助けてください。jqueryとHTML5オーディオタグを使用したオーディオソースの切り替え

私はオーディオが設定している:

<audio id="player" controls="controls"> 
      <source id="ogg_src" src="lib/audio/barger01.ogg" type="audio/ogg" /> 
      <source id="mp3_src" src="lib/audio/barger01.mp3" type="audio/mp3" /> 
      Your browser does not support the audio element. 
    </audio> 

私はトラック変更するには、リンクの動的に生成されたテーブルを持っている:

<div id="audio_list"> 
    <a href="#" class="track" data-location="http://www.newoggtrack.ogg">sample</a> 
</div> 

を私は何をすべきか見当もつかないこのjqueryのを持っていますwithトラックを変更する

$('.track').click(function(){ 

    load_track = $(this).attr('data-location');//gets me the url of the new track 

    change_track(load_track);// function to change the track of the loaded audio player without page refresh preferred... 

}); 

この機能が見つかりましたが、正しい方法で使用していません

function change_track(sourceUrl) { 

     audio.empty(); 
     $("#ogg_src").attr("src", sourceUrl).appendTo(audio); 
     /****************/ 
     audio[0].pause(); 
     audio[0].load();//suspends and restores all audio element 
     /****************/ 
    } 

audio = $("<audio>").attr("id", "player") 
         .attr("preload", "auto"); 
+2

あなたの問題は何ですか?試して切り替えようとするとどうなりますか?間違いはありますか?そして、 'function change()'のコードは直接コピー&ペーストしているのですか、それとも抜け出したコードなのでしょうか? – Ktash

+0

変更機能が見つかりましたが、機能しません。今すぐエラー –

+1

を投げ、エラーをポストします。何が間違っているのか分からなければ、人々があなたを助けることをどのように期待していますか? – bububaba

答えて

59

あなたの変更機能は、次のようにする必要があります:

function change(sourceUrl) { 
    var audio = $("#player");  
    $("#ogg_src").attr("src", sourceUrl); 
    /****************/ 
    audio[0].pause(); 
    audio[0].load();//suspends and restores all audio element 

    //audio[0].play(); changed based on Sprachprofi's comment below 
    audio[0].oncanplaythrough = audio[0].play(); 
    /****************/ 
} 

問題がaudio.empty()とオーディオVARました。空のオーディオタグを追加しようとしましたが、オーディオタグをブラウザに書き戻しませんでした。

+0

ありがとうございました。それは私が何をしていたかを明らかにし、魅力のように働く。私は賞金を正しく授与されることを願っています。 –

+0

私の問題を解決しました。 load()メソッドを使用する必要があると思われます。そうしないと、DOMが更新されたとしても、HTMLプレーヤーはサウンドを実際にロードしません。ありがとう! – Shahar

+1

audio = $( "#player") –

5

「変更」はすでにjQueryユニバース内の関数であるため、関数の名前を変更することもできます。

関連する問題