我有一个动态添加的视频元素，我以前有一个内联oncanplay脚本。
<video id="videoCurrent" type="video/mp4" oncanplay="displayVideoChapters(this);" controls>
视频元素被添加到静态div
<div id="videoDisplay"> </div>
我现在正在尝试使用 jQuery 将canplay事件附加到视频元素，从<head>中链接的脚本文件
$(document).ready(function() {
$("#videoDisplay").on('canplay', 'video#videoCurrent', function() {
console.log(this);
});
});
但是，什么也没发生。我尝试过其他活动;loadstart，pause，play相同的结果。mouseover是我唯一可以触发控制台的事件.log(this)。 我不明白什么？
我不知道jquery是否有"canplay"事件，正如我在W3C学校中看到的这个canplay事件，但用普通的javascript：
var vid = document.getElementById("videoCurrent");
vid.oncanplaythrough = function() {
console.log("Can play through video without stopping");
vid.play()
};
您可以先尝试使用第一段代码，看看它是否有效，我还记得.play()函数是用于在JavaScript中播放视频的函数，希望对您有所帮助。
我通过将 canplay 事件添加到回调函数来解决这个问题，该函数从缩略图链接获取动态视频播放器。
$('#staticVideoPlayerContainer').on('click', 'a.videoUrl', function() {
$.get('url', function(data) {
$("#videoDisplay").html(data); //Dynamic video player is added
$("#videoCurrent")[0].oncanplay = function() { //Event listener attached
console.log(this); //Logs video on canplay
}
});
});
你可以这样使用它，对我来说很好用：
$('video').each(function(index, video) {
$(video).on('canplay', function() {
console.log(video, 'this video can play');
});
});