页面上的多个 JWPlayer 实例 - 在另一个播放时暂停其他

Question

我有一个包含多个 JWPlayer 实例的页面。如果用户点击另一个视频，我想停止或暂停正在播放的视频。现在视频同时播放，很烦人。

我尝试了 JWPlayer 的停止和暂停方法，但我无法让它们工作。

提前谢谢你，这是我目前的代码（2 个视频，但还有其他几个）。

        <div class="col-lg-4">
        <div id="video1"></div>
            <script type="text/javascript">
                jwplayer().stop();                    
                jwplayer("video1").setup({
                    file: "video1.mp4",
                    image: "1.jpg",
                    width: "100%",
                    aspectratio: "16:9",
                    logo: { hide: true },
                    skin: "bekle"
                });
            </script>
        <p>Description</p>   
    </div>        

    <div class="col-lg-4">
        <div id="video2"></div>
            <script type="text/javascript">
                    jwplayer("video2").setup({
                    file: "video2.mp4",
                    image: "2.jpg",
                    width: "100%",
                    aspectratio: "16:9",
                    logo: { hide: true },
                    skin: "bekle"
                });                    
            </script>
        <p>Description</p>   
    </div>

第一个视频中的 stop() 不起作用，实际上删除了根本不加载的播放器。

Answer 1

我遍历页面上的所有播放器，然后确保除了我想播放的播放器外，所有播放器都已暂停：

<script src="https://content.jwplatform.com/libraries/your_player_here.js"></script>
<div id="videoA"></div><br><br>
<div id="videoB"></div><br><br>
<div id="videoC"></div><br><br>
<div id="videoD"></div><br><br>
<script>
    jwplayer('videoA').setup({
        file: 'bunny.mp4'
    }).on('play',function(){
        pauseOthers(this.getContainer().id);    
    });

    jwplayer('videoB').setup({
        file: 'tears.mp4'
    }).on('play',function(){
        pauseOthers(this.getContainer().id);
    });

    jwplayer('videoC').setup({
        file: 'sintel.mp4'
    }).on('play',function(){
        pauseOthers(this.getContainer().id);
    });

    jwplayer('videoD').setup({
        file: 'http://content.jwplatform.com/manifests/s8BPzDe0.m3u8'
    }).on('play',function(){
        pauseOthers(this.getContainer().id);
    });

    function pauseOthers(id) {
        console.log('Playback just started for: '+id);
        var videos = document.getElementsByTagName('video');
        for (i=0;i<videos.length;i++) {
            if (id != videos[i].parentNode.parentNode.id) {
                jwplayer(videos[i].parentNode.parentNode.id).pause(true);
                console.log('Pausing: '+videos[i].parentNode.parentNode.id);
            }
        }
    }
</script>

页面上的多个 JWPlayer 实例 - 在另一个播放时暂停其他

Multiple JWPlayer instances on page - pause others when another plays

javascript

html

jwplayer