Question

我无法找到有用的代码来让我的播放列表在网站加载时自动播放第一首歌曲，然后在歌曲播放完毕后，自动播放下一首歌曲。

我在教程后面得到了这段代码，但是他们没有包含这些函数。我看了一遍，我见过的代码对我的问题没有帮助。

var audio;

//Hide pause buton
$('#pause').hide();

//Initialize Audio
initAudio($('#playlist li:first-child'));


//Initializer Function
function initAudio(element){
    var song = element.attr('song')
    var title = element.text();

    //Create audio object
    audio = new Audio('media/' + song);

    if(!audio.currentTime){
        $('#duration').html('0.00');
    }

    $('#audio-player .title').text(title);

    $('#playlist li') .removeClass('active');
        element.addClass('active');

    }

    //PLay Button
    $('#play') .click(function(){
        audio.play();
        $('#play') .hide();
        $('#pause') .show();
        $('#duration') .fadeIn(400);
        showDuration();

    });


    //Pause Button
    $('#pause') .click(function(){
        audio.pause();
        $('#pause') .hide();
        $('#play') .show();


    });

    //Stop Button
    $('#stop') .click(function(){
        audio.pause();
        audio.currentTime = 0;
        $('#pause') .hide();
        $('#play') .show();
        $('#duration') .fadeOut(400);

    });



    //Next Button
    $('#next').click(function(){
        audio.pause();
        var next = $('#playlist li.active').next();
        if (next.length == 0) {
            next = $('#playlist li:first-child');
        }
        initAudio(next);
        audio.play();
        showDuration();
    });

    //Prev Button
    $('#prev') .click(function(){
        audio.pause();
        var prev = $('#playlist li.active').prev();
        if (next.length == 0){
            prev = $('playlist li:last-child');
        }
        initAudio (prev);
        audio.play();
        showDuration();
    });



    //Time Duration

    function showDuration(){
        $(audio).bind('timeupdate', function(){
            //Get Hours & Minutes
            var s = parseInt (audio.currentTime % 60);
            var m = parseInt ((audio.currentTime)/ 60) % 60;
            //Add 0 if less than 10
            if(s < 10){
                s = '0' + s;

            }
            $('#duration').html (m + '.' + s);
            var value = 0;
            if(audio.currentTime > 0) {
                value = Math.floor((100 / audio.duration) * audio.currentTime);

            }
            $('#progress').css('width',value+'%');
        });
    }

    //Playlist Song Click
    $('#playlist li').click(function () {
        audio.pause();
        initAudio($(this));
        $('#play').hide();
        $('#pause').show();
        $('#duration').fadeIn(400);
        audio.play();
        showDuration();
    });


    //Volume Control
    $('#volume').change(function(){
    audio.volume = parseFloat(this.value / 10);
});

Answer 1

开始播放音频声音非常简单：您可以使用

触发播放按钮的点击

$('#play').trigger('click');

当一个人结束时播放下一首歌可以在showDuration()：

中完成

if( audio.currentTime >= audio.duration) $('#next').trigger('click');

Jquery自动播放和自动播放下一首歌

1 个答案: