<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>多个H5播放器video 如何播放暂停</title>

</head>

<body>

    <video src="http://img.tianxiang.com/d/2018/06/5b1a45f89f96b.mp4" controls="controls"></video>

    <video src="http://vodfile12.news.cn/data/cdn_transfer/1F/FE/1f74d72eedda3dc922b3487f49619c4730b4fbfe.mp4" controls="controls"></video>

    <script type="text/javascript">

        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();

                }

            };

    </script>

</body>

</html>

JavaScript多个h5播放器video，点击一个播放其他暂停的更多相关文章

  1. 使用Vitamio打造自己的Android万能播放器（6）——在线播放（播放列表）

    前言 新版本的VPlayer由设计转入开发阶段,预计开发周期为一个月,这也意味着新版本的Vitamio将随之发布,开发者们可以和本系列文章一样,先开发其他功能.本章内容为"在线视频播放列表& ...

  2. 使用Vitamio打造自己的Android万能播放器（5）——在线播放（播放优酷视频）

    前言 为了保证每周一篇的进度,又由于Vitamio新版本没有发布, 决定推迟本地播放的一些功能(截图.视频时间.尺寸等),跳过直接写在线播放部分的章节.从Vitamio的介绍可以看得出,其支持http ...

  3. 使用Vitamio打造自己的Android万能播放器（4）——本地播放（快捷搜索、数据存储）

    前言 关键字:Vitamio.VPlayer.Android播放器.Android影音.Android开源播放器 本章节把Android万能播放器本地播放的主要功能(缓存播放列表和A-Z快速查询功能) ...

  4. 使用Vitamio打造自己的Android万能播放器（7）——在线播放（下载视频）

    前言 本章将实现非常实用的功能——下载在线视频.涉及到多线程.线程更新UI等技术,还需思考产品的设计,如何将新加的功能更好的融入到现有的产品中,并不是简单的加一个界面就行了,欢迎大家交流产品设计和技术 ...

  5. jqm视频播放器,html5视频播放器,html5音乐播放器,html5媒体播放器,video开展demo,html5视频播放演示示例,html5移动视频播放器

    最近看到很多有用的论坛html5视频播放的发展,音乐播放功能,大多数都在寻找答案.所以,我在这里做一个demo.对于大家互相学习.html5开发越来越流行,至于这也是一个不可缺少的一部分的视频. 如何 ...

  6. .net C# 网页播放器 支持多种格式 媒体播放器 播放器 代码

    .avi格式代码片断如下:<object id='video' width='400' height='200' border='0' classid='clsid:CFCDAA03-8BE4- ...

  7. cuplayer酷播播放器 swf 带参数直接播放

    客户需要使用cuplayer,直接调用swf 播放器. /Player/player.swf?FlvID=745,此处写入视频ID; 官方给的例子,运行是有问题的. http://www.cuplay ...

  8. 使用Vitamio打造自己的Android万能播放器（3）——本地播放（主界面、播放列表）

    前言 打造一款完整可用的Android播放器有许多功能和细节需要完成,也涉及到各种丰富的知识和内容,本章将结合Fragment.ViewPager来搭建播放器的主界面,并实现本地播放基本功能.系列文章 ...

  9. 第二十三篇-ubuntu18.04怎么下载播放器以及如何设置默认播放器

    下载播放器 安装命令:sudo apt-get install smplayer再安装解码器: 安装win32codecs包 如果是intel的CPU 代码: sudo apt-get install ...

随机推荐

  1. Git---远程仓库之从远程仓库克隆03

    远程仓库之添加远程仓库02我们讲了先有本地库,后有远程库,如何关联远程库. 现在假设我们从零开发,那么最好的方式是先创建远程库,然后,从远程库克隆. 首先,登录GitHub,创建一个新的仓库,名字叫g ...

  2. 一个简单的MVVM雏形

    这是@尚春实现的MVVM,使用定时器轮询,只支持{{}}与input.value的修改. 这只能算是一个玩具,真正的MVVM需要有更复杂的扫描机制,JS解析器,双向绑定链什么的. <!DOCTY ...

  3. Linux学习---新建文件，查看文件，修改权限，删除

    过程:在一个文件夹下面新建一个文件,然后查看文件,再修改权限,运行,最后删除 1.新建文件: touch  Test.sh 补充:新建文件有好多种方式,一般用mkdir(创建目录,即文件夹).touc ...

  4. SELinux导致的docker启动失败

    安装docker yum install -y docker 启动docker systemctl start docker 报错 Job for docker.service failed beca ...

  5. 59. Spiral Matrix II (Array)

    Given an integer n, generate a square matrix filled with elements from 1 to n2 in spiral order. For ...

  6. [Training Video - 2] [Java Introduction] [Install Java and Eclipse, Create Class]

    Download Java : https://java.com/en/download/ Download Eclipse : https://www.eclipse.org/downloads/ ...

  7. TF Boys (TensorFlow Boys ) 养成记（六）： CIFAR10 Train 和 TensorBoard 简介

    圣诞节玩的有点嗨,差点忘记更新.祝大家昨天圣诞节快乐,再过几天元旦节快乐. 来继续学习,在/home/your_name/TensorFlow/cifar10/ 下新建文件夹cifar10_train ...

  8. python进行数据清理之pandas中的drop用法

    好久好久没有更新博客了,之前自学的估计也都忘记差不多了.由于毕业选择从事的行业与自己的兴趣爱好完全两条路,心情也难过了很久,既然入职了就要好好干,仍要保持自己的兴趣,利用业余时间重拾之前的乐趣. 从基 ...

  9. 是什么优化让 .NET Core 性能飙升？（转）

    欢迎大家持续关注葡萄城控件技术团队博客,更多更好的原创文章尽在这里~~ .NET Core(开放源代码,跨平台,x-copy可部署等)有许多令人兴奋的方面,其中最值得称赞的就是其性能了. 感谢所有社区 ...

  10. ASP.NET MVC与ASP.NET Web API的区别（转）

    出处:http://blog.csdn.net/wangzl1163/article/details/72676616 MVC主要用来构建网站,既关心数据也关心页面展示,而Web API只关注数据 W ...