Question

我似乎无法让它发挥作用。我正在尝试检测是否正在播放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。但是，会有什么方法呢？

Answer 1

您的代码应为：

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

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

无论如何，此代码检测到事件＆＃34;开始播放＆＃34;，但是当添加事件处理程序时视频可能已经播放，那么您只需检查视频是否已播放类似

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

}

Answer 2

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

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

到此：

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

Answer 3

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

Answer 4

我知道已经过去了两年，但是我刚遇到这个问题，寻找另一个疑问。

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

这应该有效：

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

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

4 个答案: