<audio controls loop poster='{{poster}}' name='{{name}}' author='{{author}}' src='{{src}}' id='audioid'/><button size='mini' bindtap="audioplay" > 播放</button><button bindtap="audiopause" size='mini'>暂停</button>
controls显示音频控制键
loop循环播放
poster在控制播放键是加的图片
name音频名称
author作者
src音频文件
id唯一标识
虽然可以通过controls来播放, 如果不要controls, 也可以通过js的事件来控制播放与暂停
page({ data: { poster: 'http://y.gtimg.cn/music/photo_new/t002r300x300m000003rskf44gyask.jpg?max_age=2592000', name: '此时此刻', author: '许巍', src: 'http://ws.stream.qqmusic.qq.com/m500001vfvsj21xfqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292f51e1e384e06dcbdc9ab7c49fd713d632d313ac4858bacb8ddd29067d3c601481d36e62053bf8dfeaf74c0a5ccfadd6471160caf3e6a&fromtag=46', }, /**获取 audio上下文audiocontext对象 */ onready: function () { // 使用api: wx.createaudiocontext 获取 此音频组件的 上下文对象 this.audioctx = wx.createaudiocontext('audioid') }, /**播放 */ audioplay: function() { this.audioctx.play(); }, /**暂停 */ audiopause : function() { this.audioctx.pause(); }})
1.首先要根据音频文件的id来确定 要获取的音频组件的上下文对象(相当于这个对象绑定某音频组件)
2.通过此对象调用函数就能直接控制播放(play)与暂停(pause)
wx.createaudiocontext
对于这个api, 是根据音频组件创建其上下文对象(这个对象可以播放该音频文件)
上面使用this.audioctx = wx.createaudiocontext('audioid') --> 为this创建了audioctx属性并赋了值
还可以跳转到指定的时间:
/**跳转播放到20秒 */ audio20: function () { this.ctx.seek(20); }
相关文章：
微信小程序的媒体组件实例分析
微信小程序中自定义组件的详细介绍
相关视频：
开发微信小程序视频教程
以上就是微信小程序广告自定义组件--媒体音频播放组件audio的详细内容。