Question

我正在开发一个Wordpress插件，允许用户向其页面或帖子中添加自定义视频播放列表，为此，我正在使用Videojs和Videojs播放列表库。

我已经成功地在页面中添加了一个播放列表，但是创建第二个播放列表时，第一个播放器被禁用了。 First Player disabled

我面临的另一个问题是，尽管添加了vjs-playlist div ，但它仅在创建的第一个播放器中显示。 Code display in the browser

      var options = {"techOrder": ["html5","youtube", "flash"]};
      var myPlayer = videojs('my-playlist-player', {options, "autoplay": false, "controls": true, "fluid": true, "liveui": true});

      myPlayer.playlist([{
        name: 'Test item 1 type .m3u8',
        description: 'Testing for videojs-playlist-ui integration',
        duration: '45',
        sources: [
          {src: '//vjs.zencdn.net/v/oceans.mp4',type: 'video/mp4'}
        ],
        thumbnail: [
          {
            srcset: '//bcvid.brightcove.com/players-example-content/clouds-1800.jpg',
            type: 'image/jpeg',
            style: 'max-height: 120px;'
          }  
        ]
        },{
        name: resTitle,
        description: resDesc,
        duration: resDuration,//'45',
        sources: [
          {src: resItemSrc, type: resMime}
        ],
        thumbnail: [
          {
            srcset: resThumbnail,
            type: resImgType,
            style: thumbStyle//'max-height: 120px;'
          }  
        ]
        }
        } 
      ]);


      console.log(myPlayer.playlist());
      myPlayer.playlistUi({el: document.getElementById('vjs-playlist'), horizontal: true});
      myPlayer.playlist.autoadvance(1);

我相信我的错误会发生，因为videojs函数正在所有元素中检测到相同的ID，但是如果是这样，我该如何避免呢？

关于为什么可能会发生此错误的任何其他想法或意见，都很好。

谢谢。

Answer 1

更多信息，我想检查脚本检测到了多少个玩家，因此我在控制台中打印了window.videojs.players，即使创建了更多玩家，也只能检测到一个玩家。 Check result

这可能是因为它们具有相同的ID吗？如果是这样，如何解决？ HTML Result

VideoJS播放列表的多个实例已弃用

1 个答案: