2011-11-15 28 views
9

Varsayılan kaynağa sahip bir ses elementim var. JQuery'yi kullanarak ses kaynağını dinamik olarak değiştirmek istiyorum. Aşağıdaki kodum kaynağı değiştirir ancak her zaman varsayılan sesi çalar. Herhangi bir yardım çok takdir edilecektir. Teşekkürler.HTML5 jQuery dinamik olarak ses kaynağını değiştir

<audio id="audio_player"> 
    <source id="audio_player_ogv" src="test.ogv" type="audio/ogg" /> 
    <source id="audio_player_mp3" src="test.mp3" type="audio/mpeg" /> 
</audio> 
<a class="change_audio" rel="new_test" href="javascript:;">Change Audio</a> 

$('.change_audio').click(function() { 
    var new_audio = $(this).attr('rel'); 
    $('#audio_player_ogv').attr('src',new_audio+'.ogv').detach().appendTo($('#audio_player')); 
    $('#audio_player_mp3').attr('src',new_audio+'.mp3').detach().appendTo($('#audio_player')); 
    var aud = $('#audio_player').get(0); 
    aud.play(); 
}); 

cevap

3

yerine <source> etiketi kullanımına ilişkin, <audio> etiketinin src niteliğine kaynağını atayın. İşe yarıyor. Karşılığında, yüklenecek ses formatları arasında seçim yapmak için tarayıcı türünü elle kontrol etmeniz gerekir.

5

yapardım:

<div id="divAudio_Player"> 
    <audio id="audio_player"> 
     <source id="audio_player_ogv" src="test.ogv" type="audio/ogg" /> 
     <source id="audio_player_mp3" src="test.mp3" type="audio/mpeg" /> 
    </audio> 
</div> 
<a class="change_audio" rel="new_test" href="javascript:;">Change Audio</a> 

$('.change_audio').click(function() { 
    var new_audio = $(this).attr('rel'); 

    var source = '<audio id="audio_player">'; 
    source += '<source id="audio_player_ogv" src="' + new_audio + '.ogv" type="audio/ogg" />'; 
    source += '<source id="audio_player_ogv" src="' + new_audio + '.mp3" type="audio/mpeg" />'; 
    source += '</audio>'; 

    $('#divAudio_Player').html(source); 

    var aud = $('#audio_player').get(0); 
    aud.play(); 
}); 
İlgili konular