当前位置: 首页 > article >正文

html页面多个视频标签时设定只能播放一个视频

html页面经常会出现存在多个视频的情况,点击单个视频时,该视频播放,点击另外一个视频时,需要让正在播放的视频停止,开始播放所点击的新视频。如果不单独设置,就会出现页面同时播放多个视频的情况。

设置代码如下:

var videos = document.getElementsByTagName('video');
          for (var i = videos.length - 1; i >= 0; i--) {
              (function(){
                 var p = i;
                  videos[p].addEventListener('play',function(){
                      pauseAll(p);
                  })
             })()
          }
          function pauseAll(index){
              for (var j = videos.length - 1; j >= 0; j--) {
                  if (j!=index) videos[j].pause();
              }
 
        }


http://www.kler.cn/news/155535.html

相关文章:

  • 视频智能分析国标GB28181云平台EasyCVR加密机授权异常是什么原因?
  • Java数据结构 之 包装类简单认识泛类
  • 操作系统进程与线程篇
  • 【Unity动画】什么是动画蒙版(Avatar Mask)
  • 【面试经典 150 | 二分查找】搜索插入位置
  • 【STL】手撕 string类
  • Python练习题(二)
  • re:Invent 构建未来:云计算生成式 AI 诞生科技新局面
  • IO_D3(231205)
  • Python datetime 字符串 相互转 datetime
  • C#网络编程System.Net.WebClient 类vs System.Net.Http.HttpClient 类
  • windows下docker环境搭建与运行实战
  • UCore-OS实验Lab0
  • 说一说MySQL中的锁机制
  • 通过Python Flask快速构建应用程序
  • 计算机视觉各个方向概述
  • JavaWeb 带条件的分页查询
  • 视图层与模板层
  • React如何像Vue一样将css和js写在同一文件
  • Rust多线程任务,发现有些线程一直获取不到锁【已解决】
  • 设计模式-结构型模式之装饰者设计模式
  • vscode配置代码片段
  • 吴恩达《机器学习》11-1-11-2:首先要做什么、误差分析
  • Ubuntu Linux玩童年小霸王插卡游戏
  • [MySQL]日期和时间函数
  • [Rust] 可迭代类型, 迭代器, 如何正确的创建自定义可迭代类型
  • 安防视频监控/磁盘阵列/集中云存储平台EasyCVR设备录像保活不生效原因是什么?该如何解决?
  • jdk1.8 hashmap源码阅读
  • 轻易云AI:引领企业数智化转型提升企业AI效率
  • python查询、处理、批量存入数据