JS audio播放一个的时候,其他正在播放的关闭
audio在使用中,如果有多个,在播放的时候,如果一个声音没有播放完继续下一个的话,原来正在播放的并不会关闭(在Android和PC上测试是这样,苹果产品不清楚)
现在需要做的是,当播放其中一个的时候,其他正在播放的全部关闭
实现思路:先获取当前HTML中所有的audio作为数组储存,当你指定要播放的audio,根据你所指向的audio的下标,移除该目标 ,数组剩余对象全部用关闭
具体代码如下
//获取Class对象下的所有audio对象
let audios = document.getElementsByClassName('voice')[0].getElementsByTagName('audio'); /**
*@parma audio //audio列表
*@Parma a //当前audio下标
**/
function pauseAll(audioList,a) {
for(let i = 0; i < audioList.length; i++){
if(i !== a-1){
audioList[i].pause();
}
}
}
JS audio播放一个的时候,其他正在播放的关闭的更多相关文章
- JavaScript多个音频audio标签,点击其中一个播放时,其他的停止播放
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Audio 标签的使用和自己封装一个强大的React音乐播放器
原文地址:https://www.dodoblog.cn/blog?id=5be84d5c70b2b617f27a4610 这篇文章主要介绍一下博客里的这个音乐播放器是怎么写的 为了更好的表达高深的东 ...
- js audio 播放音乐
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 【原创】使用JS封装的一个小型游戏引擎及源码分享
1 /** * @description: 引擎的设计与实现 * @user: xiugang * @time: 2018/10/01 */ /* * V1.0: 引擎实现的基本模块思路 * 1.创建 ...
- iOS Dev (20) 用 AVAudioPlayer 播放一个本地音频文件
iOS Dev (20) 用 AVAudioPlayer 播放一个本地音频文件 作者:CSDN 大锐哥 博客:http://blog.csdn.net/prevention 步骤 第一步:在 Proj ...
- iOS Dev (21) 用 AVPlayer 播放一个本地音频文件
iOS Dev (21) 用 AVPlayer 播放一个本地音频文件 作者:CSDN 大锐哥 博客:http://blog.csdn.net/prevention 前言 这篇文章与上一篇极其相似,要注 ...
- 解决audio和video在手机端无法自动播放问题
各大浏览器都为了节省流量,做出了优化,在用户没有行为动作时(交互)不予许自动播放 <audio src="music/bg.mp3" autoplay loop contro ...
- 解决html5 audio iphone,ipd,safari不能自动播放问题
html audio 在iPhone,ipd,safari浏览器不能播放是有原因滴 (在safri on ios里面明确指出等待用户的交互动作后才能播放media,也就是说如果你没有得到用户的acti ...
- 用原生js来写一个swiper滑块插件
是不是有点印象了,没错,他的最基本的用法就是左右滑动,插件使用者只需要写几行简单的html和js即可实现一个简单滑动效果,不过你完全可以组合各种元素来适应不同的场景. 当然插件我已经写好了,咱 ...
随机推荐
- spark 怎么去连接 ElasticSearch
https://stackoverflow.com/questions/52659109/cannot-read-from-elasticsearch-using-pyspark https://st ...
- Canvas入门06-线段与像素边界
我们知道,使用以下2个API可以绘制一条线段: moveTo(x, y) 向当前路径中增加一条子路径,该子路径只包含一个点,此为线段的起始点 lineTo(x, y) 将线段的下一个点加入子路径中 c ...
- MySQL数据类型之整型
还一个 Decimal 就是这么创建 查看当前数据表 查看tb1得表得所有记录....
- uwsgi + nginx 部署python项目(一)
uWSGI uWSGI是一个Web服务器,它实现了WSGI协议.uwsgi.http等协议.Nginx中HttpUwsgiModule的作用是与uWSGI服务器进行交换. 要注意 WSGI / uws ...
- Linux cat 多行写入文件防止变量替换
Linux cat 多行写入文件防止变量替换 问题描述 对多个变量及多行输出到文件,存在变量自动替换,当使用cat<<EOF不想对内容进行变量替换.命令替换.参数展开等 问题解决 转义特 ...
- nrm安装与配置
nrm安装与配置:https://blog.csdn.net/anway12138/article/details/79455224
- Luogu P1315 [NOIP2012]观光公交
题目 每次把加速器用在可以是答案减少最多的地方就即可.(这不是废话吗?) 具体而言,我们处理出: \(sum_i\)到\(i\)为止下车人数之和. \(t_i\)在\(i\)最晚的上车的人的上车时间. ...
- 什么场景下用redis而不用mysql?
redis我们用作缓存,对查询速度要求比较高的应用场景比较适合.对有复杂逻辑关系的存储不适合. mysql是硬盘存储的,在高性能io要求的项目里不能满足需求,而redis所有数据存在内存里,因此要快得 ...
- webpack收藏
收藏链接: https://www.jianshu.com/p/8ff8e71dcbc6
- react 从商品详情页返回到商品列表页,列表自动滚动上次浏览的位置
现状:目前从商品详情页返回到商品列表页,还需要再去请求服务数据,还需要用户再去等待获取数据的过程,这样用户体验非常不好, 遇到的问题: 1:如何将数据缓存, 2:如何获取和保存列表滑动的高度, 3:判 ...