Javascript 事件侦听器don'；检测不到视频的结束

我有一个HTML5播放器，我正在尝试检测视频何时结束。我尝试用JQUERY和javascript检测它，但到目前为止没有成功

<video id="myVideo"></video>

$("#myVideo").bind("ended", function () {
    alert('Video ended!');
});

var vid = document.getElementById("myVideo");
vid.src = "Content/Test.mp4";
vid.play();

vid.addEventListener('ended', videoFinish, false);

function videoFinish() {
    alert('Video ended!');
}   

$（“#myVideo”）.bind（“已结束”，函数（）{
警报（“视频结束！”）；
});
var vid=document.getElementById（“myVideo”）；
vid.src=“Content/Test.mp4”；
视频播放（）；
vid.addEventListener（'End'，videoFinish，false）；
函数videoFinish（）{
警报（“视频结束！”）；
}   

试试这个

 $('#myVideo').on('ended',function(){
          alert('Video ended!');
}

或

---

我怀疑这是因为您正在以编程方式添加src或播放视频（但只是猜测，因为您没有回答我的问题）。在加载视频后尝试添加事件：

function onVideoLoaded(e) {
  console.log('onVideoLoaded', e.target === vid);
  vid.addEventListener('ended', onVideoEnded);
}

function onVideoEnded() {
  console.log('onVideoEnded');
}

vid.addEventListener('loadstart', onVideoLoaded);

---

它在JavaScript部分工作得很好，但是如果您更喜欢使用jQuery，那么您应该取消对视频方法和属性的任何jQuery对象的引用。详细信息在代码段中注释

顺便说一句

片段

/*~~~~~~~~~~~~~~~~~~~~~~~
||纯JavaScript
*/
//创造
var vid1=document.createElement（“视频”）；
/*分配：
||#id
||src
||控制
*/
vid1.id='vid1'；
vid1.src=http://media6000.dropshots.com/photos/1381926/20170326/023642.mp4';
vid1.controls=真；
//将节点添加到DOM
文件.正文.附件（vid1）；
//将#vid1注册到结束事件以调用videoFinish（）
vid1.addEventListener（'End'，videoFinish，false）；
/*~~~~~~~
||jQuery
*/
//将此jQuery对象附加到DOM
$（''）。附于（'正文'）；
/*取消对jQuery对象的引用以使用
||方法从类似HTML5视频的JavaScript API
||使用括号表示法。
*/
var vid2=$（'#vid2'）[0]；
/*现在，vid2是一个与vid1类似的普通JavaScript对象
||现在，它可以轻松地使用视频方法和属性
*/
vid2.addEventListener（'End'，videoFinish，false）；
功能视频完成（e）{
警报（e.target.id+“已结束！”）；
}

---

我想你应该有一个视频。。。也许不仅仅是一个视频标签？没有媒体的视频标签如何“结束”？此外，您的javascript需要位于

标记中。我认为您必须为您创建的视频或链接到的视频指定src。您的代码看起来正确，但从另一方面来说，不要创建前面没有var、let或const的变量（do

var vid=…

）。另外，

bind

在5年前被弃用，取而代之的是

.on

，尽管您的原生版本也应该做同样的事情var在那里。我在复制代码时错过了它。我正在从控制器分配视频。作为一个实验，尝试静态地输入视频属性（html），看看这与编程方式相比是否有任何区别。这与已经存在的内容相比应该没有什么区别。我记得很久以前使用过第二个，并且它工作正常。我同意这只是另一种和“asker”做同样事情的方式，但对我来说是这样的。此外，我给出了在html中设置视频控件的正确方法。我认为问题就在这里。有趣的是，也许它解决了我猜正在发生的问题

function onVideoLoaded(e) {
  console.log('onVideoLoaded', e.target === vid);
  vid.addEventListener('ended', onVideoEnded);
}

function onVideoEnded() {
  console.log('onVideoEnded');
}

vid.addEventListener('loadstart', onVideoLoaded);