我的播放列表插件不适用于 videojs？

Question

目前我想在一个项目中实现 video.js 的库，并在同一个库中添加 unplugin 来制作几个视频的复制列表，但是在实现所有内容时它给我标记了以下内容：

player.playlist is not a function

我测试的完整代码：

HTML代码：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

    <link href="http://vjs.zencdn.net/4.12/video-js.css" rel="stylesheet">
    <script src="http://vjs.zencdn.net/4.12/video.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-playLists/0.2.0/videojs-playlists.js"></script>


</head>
<body>

<video id="Reproductor" class="video-js vjs-default-skin" controls
       preload="auto" width="640" height="264" poster="MY_VIDEO_POSTER.jpg"
       data-setup="{}">
    <source src="TheLast.mp4" type='video/mp4'>
    <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
</video>


</body>
</html>

代码CSS:

<style type="text/css">
        .vjs-default-skin {
            color: #000000;
        }

            .vjs-default-skin .vjs-play-progress,
            .vjs-default-skin .vjs-volume-level {
                background-color: red;
            }

            .vjs-default-skin .vjs-control-bar,
            .vjs-default-skin .vjs-big-play-button {
                background: red;
            }

            .vjs-default-skin .vjs-slider {
                background: red;
            }

            .vjs-default-skin .vjs-control-bar {
                font-size: 103%;
            }
    </style>

代码Javascript:

<script>

    $(document).ready(function() {
        var player = videojs('Reproductor');

//The problem that the browser console indicates is in the line below
        player.playlist([{
            sources: [{
                src: 'http://media.w3.org/2010/05/sintel/trailer.mp4',
                type: 'video/mp4'
            }],
            poster: 'http://media.w3.org/2010/05/sintel/poster.png'
        }, {
            sources: [{
                src: 'http://media.w3.org/2010/05/bunny/trailer.mp4',
                type: 'video/mp4'
            }],
            poster: 'http://media.w3.org/2010/05/bunny/poster.png'
        }, {
            sources: [{
                src: 'http://vjs.zencdn.net/v/oceans.mp4',
                type: 'video/mp4'
            }],
            poster: 'http://www.videojs.com/img/poster.jpg'
        }, {
            sources: [{
                src: 'http://media.w3.org/2010/05/bunny/movie.mp4',
                type: 'video/mp4'
            }],
            poster: 'http://media.w3.org/2010/05/bunny/poster.png'
        }, {
            sources: [{
                src: 'http://media.w3.org/2010/05/video/movie_300.mp4',
                type: 'video/mp4'
            }],
            poster: 'http://media.w3.org/2010/05/video/poster.png'
        }]);

        // Play through the playlist automatically.
        player.playlist.autoadvance(0);
    });

</script>

所有组件都在各自的位置。

Answer 1

应该是player.playList大写的L。

最重要的是，sources 应该是 src，一组 URL

player.playList([{
    src: ['http://media.w3.org/2010/05/sintel/trailer.mp4'],
    poster: 'http://media.w3.org/2010/05/sintel/poster.png'
}, {
    src: ['http://media.w3.org/2010/05/bunny/trailer.mp4'],
    poster: 'http://media.w3.org/2010/05/bunny/poster.png'
}, {
    src: ['http://vjs.zencdn.net/v/oceans.mp4'],
    poster: 'http://www.videojs.com/img/poster.jpg'
}, {
    src: ['http://media.w3.org/2010/05/bunny/movie.mp4'],
    poster: 'http://media.w3.org/2010/05/bunny/poster.png'
}, {
    src: ['http://media.w3.org/2010/05/video/movie_300.mp4'],
    poster: 'http://media.w3.org/2010/05/video/poster.png'
}]);

我的播放列表插件不适用于 videojs？

my playlist plugin is not working on videojs?

javascript

video

jquery

html5-video

video.js