javascript - 视频加载后的 jQuery 加载函数

标签 javascript jquery

我有这样的 HTML 代码:

... <video id="abc" preload="auto" autoplay="autoplay" loop="loop" webkit-playsinline="">
    <source src="3.mp4" type="video/mp4">
</video> ...

我使用了这个 JS 代码:

$(document).ready(function () {
"use strict";


    $("#abc").load(function () {
        console.log(3);
    });
});

我想在视频加载时运行该函数。 JS 代码适用于 img 标签,但不适用于 video 标签。我希望它像 img 标签一样工作。就像我不希望它在从缓存中加载视频时运行一样。
我该怎么做?

最佳答案

HTML 元素 video 没有 load 事件。它还有其他的,例如 loadstartloadeddataloadedmetadata。查看可能的视频事件的完整列表 here .

$("#abc").on("loadstart", function() {
  console.log(3);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<video id="abc" preload="auto" autoplay="autoplay" loop="loop" webkit-playsinline="">
  <source src="https://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" type="video/mp4">
</video>

loadeddata:当浏览器加载了音频/视频的当前帧时触发
loadedmetadata:当浏览器加载了音频/视频的元数据时触发
loadstart:当浏览器开始寻找音频/视频时触发

关于javascript - 视频加载后的 jQuery 加载函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38012592/

相关文章:

jQuery:使用多个类进行过滤

javascript - 移动设备上的 Jquery CSS 动画错误

javascript - Nanoscroller 显示无法读取未定义的属性 'style' 为什么?

javascript - 如何在 Node Webkit 桌面应用程序中使用 Google Analytics

javascript - JavaScript 中的增量正确性递归算法

jquery,是否可以将信息存储在变量中,而不是输入字段中?

jquery - 延迟问题()

javascript - 在另一个 promise 中解决 promise

javascript - 从 ajax 读取值以 json 格式返回

javascript - 为什么 no-return-await 与 const x = wait ?