检测是否正在播放特定的 html5 视频答案

【问题标题】：detect if specific html5 video is playing检测是否正在播放特定的 html5 视频
【发布时间】：2017-10-24 11:20:30
【问题描述】：

我似乎无法让它工作。我正在尝试检测 ID 为 normalloop1 的特定 html5 视频是否正在播放。

HTML：

 <video id="level1" autoplay controls="none" class="normal-video">
 <source class="active" src="videos/intro.mp4" type='video/mp4'/>
 <source src="videos/video1.mp4" type='video/mp4'/>
 <source src="videos/video2.mp4" type='video/mp4'/>
 <source id="normalloop1" class="loop" src="videos/loop1.mp4" 
 type='video/mp4'/>
 </video>

Javascript：

 $(document).ready(function () {
     $('normalloop1').one('play', function () {
         alert("Test");
     });
 });

我认为问题可能在于，ID 为 normalloop1 的视频在其中有一个 ID。但是，有什么办法呢？

【问题讨论】：

Check if a HTML5 video element is playing的可能重复
Check if a HTML5 video is playing using jquery的可能重复

标签： javascript html video playback detect

【解决方案1】：

你的代码应该是：

$(document).ready(function () {
     $('#normalloop1').on('play', function () {
         alert("Test");
     });
});

注意#，它表示normalloop1 是id 属性。没有它，jQuery 正在寻找一个名为 <normalloop1> 的标签。

无论如何，这段代码检测到“开始播放”事件，但可能在添加事件处理程序时视频已经在播放，那么你可以检查视频是否已经在播放类似的东西

var video = $('#normalloop1').get(0);
if (!video.paused && !video.ended) {

}

【讨论】：

我写了一个而不是 on，太棒了。但是，我没有使用 jQuery，由于某种原因它仍然无法正常工作。我认为有冲突，因为这个 id 可能在另一个 id 中？
如果你不使用jQuery，什么库使用$作为全局变量？

【解决方案2】：

问题很可能是您的 JQuery 选择器。你要一个 ID，所以改变这一行：

$('normalloop1').one('play', function () {

到这里：

$('#normalloop1').one('play', function () {

【讨论】：

我还不能评论其他人的答案，所以我必须在这里做：one() 在这里也有效，因为它与 on() 方法相同，除了因为元素处理程序在第一次调用JQuery documentation 后未绑定
我没有使用 jQuery，由于某种原因它仍然无法正常工作。我认为有冲突，因为这个 id 可能在另一个 id 中？
.one() 方法虽然是一种 JQuery 方法 - 仅 Javascript 不具备此功能。此外，您的选择器 $('#normalloop1') 仅在 JQuery 中使用。因此，如果您正在编写 JQuery，但您没有使用它，我想我已经找到了您的问题 ;-)

【解决方案3】：

你可以在视频控制器上绑定play事件，然后检查哪个是current selected source

【讨论】：

【解决方案4】：

我知道两年过去了，但我只是在寻找另一个疑问时遇到了这个问题。

我认为选择器是错误的。我认为你应该改用#level1。

这应该可行：

$(document).ready(function () {
     $('#level1').one('play', function () {
         alert("Test");
     });
 });

【讨论】：