当一个人启动时，如何在页面上暂停所有播放的VideoJS实例？

我现在想出了这个解决方案：

var myPlayer1 = _V_("ID1"); var myPlayer2 = _V_("ID2"); ... ... var myFunc1 = function(){ var myPlayer1 = this; myPlayer2.pause(); myPlayer3.pause(); myPlayer4.pause(); ... }; myPlayer1.on("play", myFunc1); var myFunc2 = function(){ var myPlayer2 = this; myPlayer1.pause(); myPlayer3.pause(); myPlayer4.pause(); ... }; myPlayer2.on("play", myFunc2); ... 

还有其他理智的方法吗？

谢谢。

Answer 1

假设您使用jQuery，您可以尝试此解决方案。

您可以尝试避免暂停当前未播放的video。 这可以通过在循环中添加另一个检查来完成 – 此处每当另一个video开始播放时，页面上的所有video都会暂停。

此外，可能有更好的方法来避免videoID（ike $（this）.player或类似的东西），但这可以完成这项工作。

  $(".video-js").each(function (videoIndex) { var videoId = $(this).attr("id"); _V_(videoId).ready(function(){ this.on("play", function(e) { //pause other video $(".video-js").each(function (index) { if (videoIndex !== index) { this.player.pause(); } }); }); }); }); 

Answer 2

在纯JS上也一样 ：

 var medias = Array.prototype.slice.apply(document.querySelectorAll('audio,video')); medias.forEach(function(media) { media.addEventListener('play', function(event) { medias.forEach(function(media) { if(event.target != media) media.pause(); }); }); }); 

Answer 3

我将它用于新的Videojs v5

 $('.video-js').each(function () { videojs(this.id).ready(function () { myPlayer = this; myPlayer.play(); }); });