如何在 JW Player 中显示带有播放列表的 "Previous" 按钮？

Question

https://i.stack.imgur.com/MXTB3.jpg

我正在使用带有播放列表（3 个项目）的 JW Player。

但是正如您在图片中看到的那样，它只显示了一个 "Next" 按钮。

你能帮我显示"Previous"按钮吗？

我已阅读 JW Player 文档，但找不到它。

Answer 1

这个"feature"是在JW 7.7.0引入的，现在最新的JW版本是JW7.7.6，官方还没有办法configure/customise/turn关闭

它与 "Next Up" 功能和一个新的叠加播放列表相关联，如果您不在场，这真的会扰乱您的 JW 实施 - 但 JW 团队似乎并不关心这个！

您可以编写自己的 JS/CSS 来隐藏这些新元素并添加 "previous" 功能，但目前最简洁的方法是恢复使用 JW 7.6.1。

您可以link到这里的云图书馆：//ssl.p.jwpcdn.com/player/v/7.6.1/jwplayer.js

Answer 2

这是我使用 JW Player API 中的 addButton 功能向我的播放器添加 "previous" 按钮所必须做的。这是针对 JW Player 8 的。请注意，它需要 jquery 将 "previous" 按钮移动到 "next" 按钮旁边。我在代码中包含了 jquery。

<div id="player"></div>
<script src="/path/to/your/jwplayer.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
    var player = jwplayer('player');

    jwplayer.key="your license key goes here";

    player.setup({
        playlist: 'https://cdn.jwplayer.com/v2/playlists/6tYY3mSy'
    });


    player.on('ready', function() {

        // The following code uses the addButton function from the JW Player API.
        player.addButton(
            '<svg xmlns="http://www.w3.org/2000/svg" class="jw-svg-icon jw-svg-icon-prev" viewBox="0 0 240 240"><path transform="translate(240, 0) scale(-1, 1) " d="M165,60v53.3L59.2,42.8C56.9,41.3,55,42.3,55,45v150c0,2.7,1.9,3.8,4.2,2.2L165,126.6v53.3h20v-120L165,60L165,60z"></path></svg>',
            'Previous',
            function() {
                if (player.getPlaylistIndex() === 0) {
                    // If the user is at the first video in the playlist, loop around to the last video
                    player.playlistItem( Math.max(0, player.getPlaylist().length - 1) );
                }
                else {
                    // Otherwise, go to the previous video in the playlist
                    player.playlistItem( Math.max(0, player.getPlaylistIndex() - 1) ); 
                }
            },
            'previous',
            'jw-icon-prev'
        );

        // The following line is a hack to move the button next to the "next" button
        // Note that this is not officially supported so use at your own risk. It has worked fine for me so far.
        $('.jw-controlbar .jw-icon-next').before($('.jw-icon-prev'));
    });
</script>

如何在 JW Player 中显示带有播放列表的 "Previous" 按钮？

How to display "Previous" button with playlist in JW Player?

javascript

button

jwplayer