html限制仅有一个音/视频可播放

html限制仅有一个音/视频可播放

js 复制代码
/** 多个音频仅能播放一个 */
function audiosPlay() {
  const audios = document.getElementsByTagName('audio');
  const videos = document.getElementsByTagName('video');

  function pauseAll() {
    var self = this;
    [].forEach.call(audios, function (i) {
      if (i !== self) i.pause();
    });
    [].forEach.call(videos, function (i) {
      i.pause();
    });
  }

  [].forEach.call(audios, function (i) {
    i.addEventListener('play', pauseAll.bind(i));
  });
}

/** 多个视频仅能播放一个 */
function videosPlay() {
  const audios = document.getElementsByTagName('audio');
  const videos = document.getElementsByTagName('video');

  function pauseAll() {
    var self = this;
    [].forEach.call(videos, function (i) {
      if (i !== self) i.pause();
    });
    [].forEach.call(audios, function (i) {
      i.pause();
    });
  }

  [].forEach.call(videos, function (i) {
    i.addEventListener('play', pauseAll.bind(i));
  });
}
相关推荐
h×35 小时前
FPGA视频4分屏项目 - 系统架构详细讲解
fpga开发·音视频
你别说话了5 小时前
Vue项目解决跨域
前端·javascript·vue.js
指尖时光.5 小时前
Three.js 超全入门综合案例
开发语言·javascript·ecmascript
唐青枫6 小时前
http-server:别再双击 index.html,一条命令把目录变成网站
前端·javascript
学习星球9 小时前
Solid.js 实战:拆解官方 RealWorld 项目
开发语言·javascript·vue.js
怪奇云呼军10 小时前
知识库也会注入指令?闪电智能VoiceAgent 如何防住 Prompt Injection
人工智能·python·算法·云计算·音视频
YuJie10 小时前
JSBridge 基础知识
前端·javascript
默_笙10 小时前
🍕 后端接口还没写好,前端已经跑起来了?Mock 数据 + axios 接口层,前后端再也不互相"等"
前端·javascript
EasyDSS10 小时前
开会不用装App:私有化音视频系统EasyDSS即时视频会议,浏览器点开就能聊,AI帮你写纪要
人工智能·音视频
爱勇宝10 小时前
客户只想看个页面,我却做了一个静态演示发布系统
前端·javascript·后端