JW Player - 使用事件处理程序停止(目标)多个玩家

JW Player - Stop (target) Multiple Players with an Event Handler

我有一个点击处理程序来触发内置 jwplayer().stop(); 功能。但是只有我的第一个处理程序执行而另一个失败(但没有记录错误)。

视频嵌入到视图中的元素 div 中。

换句话说:我可以停止第一个视频,但不能停止第二个、第三个等等,即使我能够在 function().

中记录每个后续点击

想法? 谢谢。

$(function(){
    console.log('ready');
    $('.stop').on('click',function stopVideo () {
       //stop JW player
        if (typeof(jwplayer) != 'undefined') {
                console.log('video stopped');
                jwplayer().stop();

            }         
    })
});

查看

<body>
<div class="container">
    <!-- first video -->
    <div class="jw" style="width: 40%; margin: 10px auto">
        <script src="//content.jwplatform.com/players/4sng2RGX-UQtQ90mG.js"></script>
        <button class="stop" style="padding: 8px 19px; float: right; margin: 10px">stop video</button>
    </div>

    <!-- second video -->
    <div class="jw" style="width: 40%; margin: 10px auto">
        <script src="//content.jwplatform.com/players/z5Jka98V-UQtQ90mG.js"></script>
        <button class="stop" style="padding: 8px 19px; float: right; margin: 10px">stop video</button>
    </div>
</div>
</body>

您的 stopVideo() 函数无法知道应该停止哪个视频。 jwplayer 只是一些全局变量,可能与您单击的按钮相关,也可能不相关。

根据 针对多个玩家 下的 JW 文档:

Not including an ID or index with your API call will always target the first player on a page. https://developer.jwplayer.com/jw-player/docs/developer-guide/api/javascript_api_introduction/

这是一个解决方案:

$(function(){
    //get every video with class .stopVideo
    var count = $('.stopVideo').length;

    $('#stop').on('click',function() {
       //loop through all videos stored in count
       for(var i = 0; i < count; i++) {
        if (typeof(jwplayer) != 'undefined') {
                console.log('video stopped');
                //stop player
                jwplayer(i).stop();

            } 
        }        
    })
});

查看

<body>
<div class="container">
    <!-- first video -->
    <div class="stopVideo">
        <script src="//content.jwplatform.com/players/4sng2RGX-UQtQ90mG.js"></script>
    </div>

    <!-- second video -->
    <div class="stopVideo">
        <script src="//content.jwplatform.com/players/z5Jka98V-UQtQ90mG.js"></script>
    </div>
    <button id="stop">stop video</button>
</div>
</body>

我同意有人在没有给出理由的情况下否决问题是很不幸的。继续努力,祝编码愉快!