jPlayer с плейлистом: «конец» запускается только после «setmedia» следующего трека - PullRequest
0 голосов
/ 26 сентября 2019

Примечание. Это вопрос обмена знаниями, поскольку я уже нашел хорошее решение.

Проблема:

Реализация списка воспроизведения (http://jplayer.org/latest/demo-02-jPlayerPlaylist/) было построено с использованием событий jPlayer. Одним из побочных эффектов этого является то, что если вы хотите ответить на начало трека, связавшись с «setmedia», а конец трека, связавшись с событием «закончились», вы найдетеэтот «конец» запускается только после активации следующей строки.

Это означает, что события будут срабатывать в следующем порядке:

  • setmedia дорожки #1
  • setmedia дорожки № 2 (включая перемещение класса jp-playlist-current )
  • окончание дорожки# 1

Итак, вопрос в следующем: как запустить событие «конец» перед переходом к следующему треку?

1 Ответ

0 голосов
/ 26 сентября 2019

Основная причина этой проблемы состоит в том, что реализация списка воспроизведения связывает себя с событием 'закончено' перед нашим связыванием .

Таким образом, решение будетпривязать наш код перед кодом списка воспроизведения.

В следующем ответе: jQuery слушатель события привязки перед другим мы можем найти следующую реализацию для метода preBind:

$.fn.preBind = function (type, data, fn) {
    this.each(function () {
        var $this = $(this);

        $this.bind(type, data, fn);

        var currentBindings = $._data(this, 'events')[type];
        if ($.isArray(currentBindings)) {
            currentBindings.unshift(currentBindings.pop());
        }
    });
    return this;
};  

После добавления этой предварительной привязки мы можем сделать следующее в обработчике jPlayer 'ready':

$("#jquery_jplayer_1")
    .preBind($.jPlayer.event.ended, function(e) { 
        var cur = $('.jp-playlist').find('li.jp-playlist-current'),
            ix = cur.index(),
            is_last = cur.next().get().length == 0;
        console.log('ended index=' + ix + ', is_last=' + is_last);
    });   
...