简体   繁体   中英

Audio HTML5 Autoplay WebWorks

How does one get the HTML5 Audio tag to work in a webworks app with the Autoplay option?

Ex: On document load Audio element's src changed via javascript then audioElement.play() - this doesn't work, you have to bind the click of another link or button to audioElement.play() and click AGAIN...

Any ideas?

function playSongNow(currentID) {
    var audioElement = document.createElement('audio');
    audioElement.setAttribute('autoplay', 'true');
    audioElement.setAttribute('preload', 'true');
    audioElement.setAttribute('src', 'http://' + sessionStorage.url + ':' + sessionStorage.port + '/rest/stream.view?u=' + sessionStorage.user + '&p=' + sessionStorage.pass + '&v=1.6.0&c=BerrySonic&id=' + currentID);
    audioElement.load();
    audioElement.addEventListener("load", function() {
        audioElement.play();
        $(".duration span").html(audioElement.duration);
        $(".filename span").html(audioElement.src);
    }, true);
    $('.play').click(function() {
        audioElement.play();
    });
    $('.pause').click(function() {
        audioElement.pause();
    });
    $('.volumeMax').click(function() {
        audioElement.volume=1;
    });
    $('.volumestop').click(function() {
        audioElement.volume=0;
    });
    $('.stop').click(function() {
        audioElement.pause();
        audioElement.currentTime = 0;
    });
    $('.playatTime').click(function() {
        audioElement.currentTime= 35; //Testing skipping so used 35
        audioElement.play();
    });
}

playSongNow is called by the HTML:

<a onclick="playSongNow('2f6d656469612f52616964426f782f4d757369632f4164656c652f32312f4164656c65202d2052756d6f7572204861732049742e6d7033');"><li>Rumour Has It</li></a>

NEW: Actually I think I've narrowed the issue down to :

audioElement.addEventListener("load", function() {
    audioElement.play();
    $(".duration span").html(audioElement.duration);
    $(".filename span").html(audioElement.src);
}, true);

I tried using "canplaythrough" But neither works to determine when enough data has passed in to actually play because if you do:

audioElement.load();
audioElement.play();

I tried the following event:

audioElement.addEventListener('canplay', function() {
    alert('canplay');
    audioElement.play();
});

And this works but this doesn't mean that the audio can play without buffering does it? It also immidiately fires the "canplaythrough" event.

Some guidance on these events would be handy.

You can handle this with the ended event like the following :

audioElement.addEventListener('ended', function(){
playSongNow(......)
}, false);

canplaythrough不能在黑莓上启动,但是canplay可以。...不要问我为什么....

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM