Добавление плейлиста Jplayer при установленном флажке

Я хочу добавить список воспроизведения в jplayer с помощью флажка, и когда я нажимаю флажок, URL-адрес должен быть добавлен в список воспроизведения jplayer, у меня есть URL-адрес, когда я нажимаю флажок, я получаю конкретный URL-адрес, но я не могу добавить в свой плейлист, пожалуйста, любой помогите мне, когда я добавляю, показывает мне undefined

 //This array object      
var playList = new Array();

//this check box selected event, when i click on checkbox i am having item which bring the url "http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg"
self.Selected= function (item) {
 var url = Voiceurl();
 playList.push(url);
 console.log(playList);
 //this function i am calling to add to playlist
JplayerWithPlaylist(playList)
}


function JplayerWithPlaylist(playList) {
console.log(playList);
var cssSelector = {
    jPlayer: "#jquery_jplayer_1", 
    cssSelectorAncestor: "#jp_container_1"
};
var options = {
    swfPath: "./js", 
    supplied: "oga"
};
var myPlaylist = new jPlayerPlaylist(cssSelector, playList, options);
for (i = 0; i < playList.length; i++) {

    myPlaylist.add(playList[i])
};
};

 <div id="jquery_jplayer_1" class="jp-jplayer"></div>
  <div id="jp_container_1" class="jp-audio">
  <div class="jp-type-playlist">
  <div class="jp-gui jp-interface">
  <div class="my-row btn-group jp-controls">
   <button href="javascript:;" class="btn btn-default glyphicon glyphicon-step-backward jp-previous" tabindex="1"></button>
    <button href="javascript:;" class="btn btn-default glyphicon glyphicon-play jp-play" tabindex="1"></button>
    <button href="javascript:;" class="btn btn-default glyphicon glyphicon-pause jp-pause" tabindex="1"></button>
    <button href="javascript:;" class="btn btn-default glyphicon glyphicon-step-forward jp-next" tabindex="1"></button>
   <button href="javascript:;" class="btn btn-default glyphicon glyphicon-stop jp-stop" tabindex="1"></button>
    <button href="javascript:;" class="btn btn-default glyphicon glyphicon-volume-off jp-mute" tabindex="1" title="mute"></button>
  <button href="javascript:;" class="btn btn-default glyphicon glyphicon-volume-down jp-unmute" tabindex="1" title="unmute"></button>
  <button href="javascript:;" class="btn btn-default glyphicon glyphicon-volume-up jp-volume-max" tabindex="1" title="max volume"></button>
   </div>
  </div>
  <div class="jp-playlist">
    <ul class="list-unstyled">
  <li></li>
  </ul>
 </div>
 </div>

javascript jquery jplayer knockout-2.0
person Nikil    schedule 26.10.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Пожалуйста, прочтите http://jplayer.org/latest/demo-02-jPlayerPlaylist/. .

Почему вы создаете новый плейлист при каждом добавлении? Это очень дорого и просто перезапишет ваш другой.

Создайте плейлист при загрузке страницы и добавьте в плейлист, если флажок установлен.

Похоже, вы вставляете URL-адрес в список воспроизведения, а затем добавляете каждый URL-адрес в список воспроизведения, что неверно.

Метод add() для jPlayerPlaylist принимает в качестве параметра объект, а не строку:

E.g.

myPlaylist.add({
  title:"Your Face",
  artist:"The Stark Palace",
  mp3:"http://www.jplayer.org/audio/mp3/TSP-05-Your_face.mp3",
  oga:"http://www.jplayer.org/audio/ogg/TSP-05-Your_face.ogg",
  poster: "http://www.jplayer.org/audio/poster/The_Stark_Palace_640x360.png"
});

Также item не используется в вашей функции.

Попробуй это:

$(function() {
    var jPlayerPlaylistConfig = {
        cssSelector: {
            jPlayer: "#jquery_jplayer_1", 
            cssSelectorAncestor: "#jp_container_1"
        },
        options: {
            swfPath: "./js", 
            supplied: "oga"
        },
        playlist: []
    };

    var myPlaylist = new jPlayerPlaylist(jPlayerPlaylistConfig.cssSelector, jPlayerPlaylistConfig.playList, jPlayerPlaylistConfig.options);

    //this check box selected event, when i click on checkbox i am having item which bring the url "http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg"
    self.Selected = function () {
         var url = Voiceurl();
         console.log(url); //Make sure URL actually exists

         myPlaylist.add({
            mp3: url,
         });
    }
});

Спросите меня, нужна ли вам дополнительная помощь.

person Martin Dawson    schedule 26.10.2016
comment
@спасибо за ваше время, это помогло мне, теперь у меня есть URL-адрес внутри моего плеера, но я не могу играть, мое значение URL-адреса в console.log jplayer.org/audio/ogg/Miaow-01-Tempered-song.ogg без кавычек делает, потому что это не работает, когда я нажимаю кнопку воспроизведения - person Nikil; 27.10.2016
comment
@Nikil Ты отметил как ответ? Какая часть не определена? - person Martin Dawson; 27.10.2016
comment
@Спасибо, чувак, это действительно решило мою проблему, теперь все работает нормально, я не пропускал заголовок - person Nikil; 27.10.2016
comment
я хочу добавить кнопку закрытия, и когда я нажимаю кнопку закрытия, он должен снять все флажки, которые выбраны, это возможно - person Nikil; 27.10.2016
comment
@Nikil Это еще один вопрос, и вы все равно можете найти его в Google. Если вы хотите удалить из плейлистов, вы можете просто сделать myPlaylist.remove(myIndex). - person Martin Dawson; 27.10.2016