我有一个点击处理程序来触发内置的 jwplayer().stop();
功能。但是,只有我的第一个处理程序执行,另一个处理程序失败(但没有记录错误)。
视频嵌入到 View 中的元素 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>
最佳答案
根据定位多个玩家下的 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>
我同意,当有人在没有给出理由的情况下否决一个问题时,这是不幸的。坚持下去,祝编码愉快!
关于javascript - JW Player - 使用事件处理程序停止(目标)多个玩家,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46105319/