87,997
社区成员
发帖
与我相关
我的任务
分享【请教】播放多个音频，顺序播放/设置间隔时间，有插件或者控件啥的吗？
播放多个音频，顺序播放/设置间隔时间，有插件或者控件啥的吗？
1、多个音频，顺序播放
2、页面可以设置播放间隔，比如默认为5秒，改设置为8秒
3、过程中，可以“暂停”；点击后再继续
4、过程中，可以选列表中的某个；比如正在播放第5个音频，点击播放第2个（接着顺序播放3、4、5）
请问有什么插件、控件、js库之类的吗？
或者类似的？
先行谢过～～～
...全文
请发表友善的回复…
发表回复
hgwyl 2020-12-13
- 打赏
- 举报
你这是曲线救国 啊哈哈[/quote]
最后用了JS原生的延迟函数解决了。
同样谢谢大哥~
网络游侠2012 2020-12-12
- 打赏
- 举报
你这是曲线救国 啊哈哈
hgwyl 2020-12-11
- 打赏
- 举报
看了一下。
这个这个…技术不够，不会用……
hgwyl 2020-12-11
- 打赏
- 举报
等挺久，那兄弟没来，先结贴了。找机会另外结给他好了。（不过他应该很多分）
similing 2020-12-09
- 打赏
- 举报
其实这里你可以用WebAudioAPI直接控制管理的：
https://developer.mozilla.org/zh-CN/docs/Web/API/Web_Audio_API
hgwyl 2020-12-07
- 打赏
- 举报
比较完美的办法，就是在点击播放按钮时，“延迟5秒后再播放”
这个“延迟5秒后再播放”怎么实现？
<script>
//音乐资源
var myMusics = new Array(
{src:"Tara&筷子兄弟 小苹果.mp3",title:"Tara&筷子兄弟 小苹果"},
{src:"悲怆第三章.mp3",title:"悲怆第三章"},
{src:"Sound of My Dream.mp3",title:"Sound of My Dream"}
);
//数组下标
var index = 1;
//播放状态 单曲循环：0 列表循环：1 随机播放：2
var playState = 1;
//创建音乐列表
function createBox(){
var html="";
for(var i=0;i<myMusics.length;i++){
html+="<li>"+(i+1)+" <a href='javascript:clickName("+i+");'>"+myMusics[i].title+"</a></li>"
}
return html
}
//页面加载
$(document).ready(function(){
$("#"+"box").append(createBox());
playMusic(1);
//按钮"下一首"单击事件
$("#nextMusic").click(function(){
playMusic(1,1);
});
//按钮"上一首"单击事件
$("#lastMusic").click(function(){
playMusic(2);
});
////按钮"播放/暂停"单击事件
$("#playMusic").click(function(){
if($(this).val()=="播放"){
$(this).val("暂停");
document.getElementById("media").play();
}else if($(this).val()=="暂停"){
$(this).val("播放");
document.getElementById("media").pause();
}
});
//播放状态
$("#playState").change(function(){
playState = $(this).val();
});
$("li").mouseover(function(){
$(this).css("background-color","#F0F0F0");
});
$("li").mouseout(function(){
$(this).css("background-color","#FFFFFF");
$($("li")[index]).css("background-color","#F0F0F0");
});
});
//点击名字播放音乐
function clickName(i){
index=i;
playMusic(0);
}
//音乐播放
function playMusic(s,n){
$("#playMusic").val("暂停");
if(s==0){//点击名字播放音乐
}else if(s==1){//下一首
$("#playMusic").val("暂停");
if(playState==0){//单曲循环
if(n==0){
}else if(n==1){
index++;
if(index>=myMusics.length){
index=0;
}
}
}else if(playState==1){//列表循环
index++;
if(index>=myMusics.length){
index=0;
}
}else if(playState==2){//随机播放
index = Math.floor(Math.random()*myMusics.length);
}
}else if(s==2){//上一首
index--;
if(index<0){
index=myMusics.length-1;
}
}
//修改audio资源路径
$("#media").attr("src",myMusics[index].src);
//音乐播放
$("#media").play;
//显示音乐名称
$("#musicTitle").text(myMusics[index].title);
$("title").text(myMusics[index].title);
//重置li列表背景色
$("#box").children("li").css("background-color","#FFFFFF");
$("#box").children("li").css("font-weight","normal");
//修改播放音乐背景色
$($("#box").children("li")[index]).css("background-color","#F0F0F0");
$($("#box").children("li")[index]).css("font-weight","bold");
$("#sliding").offset({left:60});
}
</script>
<audio id="media" src="" autoplay="autoplay" onended="playMusic(1,0)"></audio>
<div style="float:left;margin-left:50px;width:450px;height:200px;">
<p id="musicTitle"></p>
<input id="lastMusic" type="button" value="上一首" />
<input id="playMusic" type="button" value="暂停" />
<input id="nextMusic" type="button" value="下一首" />
<ul id="box" style="border:1px solid black;padding:0px;height:300px;width:300px;overflow-y:auto;"></ul>
</div>
hgwyl 2020-12-07
- 打赏
- 举报
chinaz那边找到一个jquery
基本符合条件
能顺序播放，能暂停（后继续播放），有列表
https://sc.chinaz.com/jiaobendemo.aspx?downloadid=232015114504846
现在还欠缺一个功能：正常播放的话，2段音频间设置时间间隔。
想了一下，如果可以在音频前插入1个5秒的空白音频，就相当于间隔了。
（完整功能是分别准备5、6、7、8、9、10……秒的空白音频，设置不同时间间隔时调用对应的空白音频）
请经验大神们指点一下，代码应该怎么写……？
hgwyl 2020-12-07
- 打赏
- 举报
“设置时间间隔”
1、JS可以原生实现吗？暂停5秒再继续播放。
2、如果JS不能原生实现的话，貌似可以准备一个5秒的静音音频，循环插入正常音频之中，实现“时间间隔”效果？
