属性名 | 类型 | 默认值 | 说明 |
id |
String |
|
video 组件的唯一标识符 |
src |
String |
|
要播放音频的资源地址 |
loop |
Boolean |
false |
是否循环播放 |
controls |
Boolean |
true |
是否显示默认控件 |
poster |
String |
|
默认控件上的音频封面的图片资源地址,如果 controls 属性值为 false 则设置 poster 无效 |
name |
String |
未知音频 |
默认控件上的音频名字,如果 controls 属性值为 false 则设置 name 无效 |
author |
String |
未知作者 |
默认控件上的作者名字,如果 controls 属性值为 false 则设置 author 无效 |
binderror |
EventHandle |
|
当发生错误时触发 error 事件,detail = {errMsg: MediaError.code} |
bindplay |
EventHandle |
|
当开始/继续播放时触发play事件 |
bindpause |
EventHandle |
|
当暂停播放时触发 pause 事件 |
bindtimeupdate |
EventHandle |
|
当播放进度改变时触发 timeupdate 事件,detail = {currentTime, duration} |
bindended |
EventHandle |
|
当播放到末尾时触发 ended 事件 |
这是标签audio的一些属性。。如果当。audio出现错误的时候 如 binderror:function(e){}这个方法时 e.detail.errMsg会报如下错误。
返回错误码 | 描述 |
MEDIA_ERR_ABORTED |
获取资源被用户禁止 |
MEDIA_ERR_NETWORD |
网络错误 |
MEDIA_ERR_DECODE |
解码错误 |
MEDIA_ERR_SRC_NOT_SUPPOERTED |
不合适资源 |
例外 audio 还有一个是 action 属性,这个属性接受的参数 是一个object类型。他有两个值是:method 和 data
method | 描述 | data |
play |
播放 |
|
pause |
暂停 |
|
setPlaybackRate |
调整速度 |
倍速 |
setCurrentTime |
设置当前时间 |
播放时间 |
另外audio还可可以创建并返回上下文的audioContext对象。。。前端的童鞋可以把他理解成 getElementById。
他的调用方法是 wx.createAudioContext(audioId) 他的方法则如下。
方法 | 参数 | 说明 |
play |
无 |
播放 |
pause |
无 |
暂停 |
seek |
position(number) |
跳转到指定位置,单位 s |
/* ---page/test/test.wxml----*/
< audio id = "myAudio"
poster = "{{poster}}"
name = "{{name}}"
author = "{{author}}"
src = "{{src}}"
controls loop
bindplay = "audiobindplay"
bindpause = "audiobindpause"
bindtimeupdate = "audiobindtimeupdate"
bindended = "audiobindended"
binderror = "audiobinderror" ></ audio >
< button type = "primary" bindtap = "audioPlay" >播放</ button >
< button type = "primary" bindtap = "audioPause" >暂停</ button >
< button type = "primary" bindtap = "audio14" >设置当前播放时间为14秒</ button >
/* ---page/test/test.wxml----*/
|
/* ---page/test/test.js----*/
// audio.js
Page({
onReady: function (e) {
// 使用 wx.createAudioContext 获取 audio 上下文 context
this .audioCtx = wx.createAudioContext( 'myAudio' )
},
data: {
name: '此时此刻' , //歌曲名称
author: '许巍' , //作者名称
},
//以下是 js的api
audioPlay: function () {
this .audioCtx.play()
},
audioPause: function () {
this .audioCtx.pause()
},
audio14: function () {
this .audioCtx.seek(14)
},
//以下是audio的属性。
audiobindplay: function (e){
console.log( "音频开始播放" )
},
audiobindpause: function (e){
console.log( "音频暂停中" )
},
audiobindtimeupdate: function (e){
console.log( "修改了当前的播放时间。" )
},
audiobindended: function (e){
console.log( "音频播放结束" )
},
audiobinderror: function (e){
console.log( "音频出错了。
" ,e.detail.errMsg)
}
})
/* ---page/test/test.js----*/
|
那么主要注意的是 audiobindtimeupdate 这个方法 他并不是用户修改了当前播放时间才执行,而是音乐在播放的时候他都会执行N次。具体执行一下就好了。