Onended切换到下一首曲目

时间:2013-11-03 04:50:28

标签: javascript jquery html recursion

我正在尝试制作MP3播放器。在这里,我希望在当前大头钉结束后切换到下一首歌曲。

以下是我的代码的一部分:

function clicki(ID, norrnd) {

  if (norrnd == 'nor') {
    $('.liActive').removeClass('liActive');
    $('#' + ID).next().addClass('liActive');

    // Set track Data
    $('audio').attr('id', 'audioNor');
    $('audio').attr('src', $('.liActive').attr('rel'));

    // Play
    var player = $('.tbd').get(0);
    player.play();
    $('#pause').removeClass('hi');

    $(player).bind('ended', clicki(ID++, 'nor')); //as well as .onfinish result in TOO MUCH RECURSION error.
  }
}
<audio controls id="" class="tbd" type="audio/mpeg" src="Ella Fitzgerald - It Don't Mean a Thing.mp3"></audio>

因此,当我第一次启动clicki()时,页面会立即冻结:

  

太多的递归。

如何在没有递归泛滥的情况下自动切换曲目?

1 个答案:

答案 0 :(得分:0)

您正在立即调用该函数 - 您需要在其周围创建一个函数:

function clicki(ID, norrnd) {
  if (norrnd === 'nor') {
    $('.liActive').removeClass('liActive');
    $('#' + ID).next().addClass('liActive');

    // Set track Data
    $('audio').attr('id', 'audioNor');
    $('audio').attr('src', $('.liActive').attr('rel'));

    // Play
    var $player = $('.tbd');;
    $player.get(0).play();
    $('#pause').removeClass('hi');

    // if you call it now, it's going to keep calling itself
    $player.bind('ended', function () {
      clicki(ID++, 'nor');
    });
  }
}