jsaudio循环播放_js/jquery点击按钮循环播放声音

A. jquery怎么设置audio的loop

这个东西最好用原生js效果更好，速度更快，给你个全点的例子

<script>
varaudio;
window.onload=function(){
initAudio();
}
varinitAudio=function(){
//audio=document.createElement("audio")
//audio.src='NeverSayGoodBye.ogg'
audio=document.getElementById('audio');
//audio.loop="loop";//这里就可以直接设置loop了
}
functiongetCurrentTime(id){
alert(parseInt(audio.currentTime)+'：秒');
}

functionplayOrPaused(id,obj){
if(audio.paused){
audio.play();
obj.innerHTML='暂停';
return;
}
audio.pause();
obj.innerHTML='播放';
}

functionhideOrShowControls(id,obj){
if(audio.controls){
audio.removeAttribute('controls');
obj.innerHTML='显示控制框'
return;
}
audio.controls='controls';
obj.innerHTML='隐藏控制框'
return;
}
functionvol(id,type,obj){
if(type=='up'){
varvolume=audio.volume+0.1;
if(volume>=1){
volume=1;

}
audio.volume=volume;
}elseif(type=='down'){
varvolume=audio.volume-0.1;
if(volume<=0){
volume=0;
}
audio.volume=volume;
}
document.getElementById('nowVol').innerHTML=returnFloat1(audio.volume);
}
functionmuted(id,obj){
if(audio.muted){
audio.muted=false;
obj.innerHTML='开启静音';
}else{
audio.muted=true;
obj.innerHTML='关闭静音';
}
}
//保留一位小数点

functionreturnFloat1(value){
value=Math.round(parseFloat(value)*10)/10;
if(value.toString().indexOf(".")<0){
value=value.toString()+".0";
}
returnvalue;
}
</script>

<ahref="javascript:void(0);"onclick="getCurrentTime('firefox');">获取播放时间</a>
<ahref="javascript:void(0);"onclick="playOrPaused('firefox',this);">播放</a>
<ahref="javascript:void(0);"onclick="hideOrShowControls('firefox',this);">隐藏控制框</a>
<ahref="javascript:void(0);"onclick="muted('firefox',this);">开启静音</a>
<inputtype="button"value="+"id="upVol"onclick="vol('firefox','up',this)"/>音量<inputtype="button"value="-"onclick="vol('firefox','down',this)"/>
<audiosrc="/images/audio/NeverSayGoodBye.ogg"id="audio"controls="controls"></audio>

当前音量：<spanid="nowVol">-</span>

B. 如何用js控制audio元素连续播放mp3文件

1、首先我们先来看一下音频元素最基本的应用以及样式，如下图所示，运用audio元素即可,controls是用来控制是否显示控制条。

C. html5多次用js播放audio之后就没有声音了. 重新刷新之后又好了

推荐你采用控制

既然看到送你一个demo吧，自行研究，应该都很详细了

<!doctypehtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<metaname="viewport"content="width=device-width,initial-scale=1user-scalable=0"/>
<linkrel="shortcuticon"href="img/logo.png">
<title>html5audio音频播放</title>
<style>
*{margin:0;padding:0;}
body{-webkit-tap-highlight-color:rgba(0,0,0,0);font-family:"微软雅黑"}
h1{width:100%;font-size:1.5em;text-align:center;line-height:3em;color:#47c9af;}
#audio{width:100%;}
#control{width:150px;height:150px;line-height:150px;text-align:center;border-radius:200px;border:none;color:#fff;margin-top:-75px;margin-left:-75px;left:50%;top:50%;position:absolute;box-shadow:#888008px;}
.color_gray{background:#e4e4e4}
.hide{display:none;}
.show{display:block;}
.play{background:#f06060;}
.pause{background:skyblue}
/*进度条样式*/
.progressBar{width:100%;height:10px;margin:30pxauto30pxauto;position:absolute;left:0;bottom:35px;}
.progressBardiv{position:absolute;}
.progressBar.progressBac{width:100%;height:10px;left:0;top:0;background:#e4e4e4;}
.progressBar.speed{width:100%;height:10px;left:-100%;background:#f06060;}
.progressBar.drag{width:30px;height:30px;left:0;top:-10px;background:skyblue;opacity:0.8;border-radius:50px;box-shadow:#fff005px;}
/*时间样式*/
#time{width:100%;height:20px;position:absolute;left:0;bottom:30px;color:#888;}
.tiemDetail{position:absolute;right:10px;top:0;}
#songInfo{overflow:hidden;width:200px;height:50px;line-height:50px;text-align:center;color:#34495e;margin-top:-25px;margin-left:-100px;left:50%;top:70%;position:absolute;}
.shareImg{position:absolute;left:100000px;}
</style>
</head>

<body>
<script>
$(function(){
getSong();
})

//获取歌曲链接并插入dom中
functiongetSong(){
varaudio=document.getElementById("audio");
audio.src="

audio.loop=true;//歌曲循环
playCotrol();//播放控制函数

}

//点击播放/暂停
functionclicks(){
varaudio=document.getElementById("audio");
$("#control").click(function(){
if($("#control").hasClass("play")){
$("#control").addClass("pause").removeClass("play");
audio.play();//开始播放
dragMove();//并且滚动条开始滑动
$("#control").html("暂停播放");
}else{
$("#control").addClass("play").removeClass("pause");
$("#control").html("点击播放");
audio.pause();
}
})
}

//播放时间
functiontimeChange(time,timePlace){
vartimePlace=document.getElementById(timePlace);
//分钟
varminute=time/60;
varminutes=parseInt(minute);
if(minutes<10){
minutes="0"+minutes;
}
//秒
varsecond=time%60;
seconds=parseInt(second);
if(seconds<10){
seconds="0"+seconds;
}
varallTime=""+minutes+""+":"+""+seconds+""
timePlace.innerHTML=allTime;
}

//播放事件监听

D. js/jquery点击按钮循环播放声音

E. js中怎么让音频重复播放

然后这个是主要的js方法：

function Orderprocessing1(){
var vid = document.getElementById("myVideo");//获取音频对象
var start = 0;//定义循环的变量
var times=3;//定于循环的次数
vid.addEventListener("ended",function() {
vid.play();//启动音频，也就是播放内
start++;//循环
start == times && vid.pause();//也就是当循环的变量等于次数的时候，就会终止循环并且关掉音频
});
vid.play();//启动音频，用于第一次启动
}

如果你想调用这个方法可以写一个click事件，或者写个js方法调用：

$(function(){
setInterval("Orderprocessing1()",60000);//每隔1分钟自动调用一次启动音频的方容法
});

本人也是菜鸟一个，写这些只为整理下来以后自己看

F. html js audio，一首歌播完自动下一首歌，要怎么做

HTML5中的audio对象有个属性为 ended，改属性是返回音频是否播放结束，是boolean类型的。

例如我自己写的一个判断：
this.audioPlay=function(soundPath,callback){
$("#shapeAudio").attr("src",soundPath);
var shapeAudio=document.getElementById("shapeAudio");
shapeAudio.play();

/*判断声音是否播放完成，播放完成之后执行回调函数*/
if(callback != undefined){
var is_playFinish = setInterval(function(){
if(shapeAudio.ended){
callback();
window.clearInterval(is_playFinish);
}
}, 10);
}
}

改判断为当声音播放完成之后再执行回调函数callback

G. HTML5 <audio>标签如何设置连续播放

<audiocontrols="controls"loop="loop">
<sourcesrc="song.ogg"type="audio/ogg"/>
<sourcesrc="song.mp3"type="audio/mpeg"/>
.
</audio>

loop 属性规定当音频结束后将重新开始播放。如果设置该属性，则音频将循环播放。

语法：<audio loop="loop" />

导航:首页 > 编程语言 > jsaudio循环播放

jsaudio循环播放

与jsaudio循环播放相关的资料

友情链接