微信小程序(音乐视频播放)

小程序 专栏收录该内容
19 篇文章 1 订阅
Page({

  /**
   * 页面的初始数据
   */
  data: {
    poster: '../../images/sp2.png',
    name: '白驹',
    author: '徐绍斌',
    src: 'http://ws.stream.qqmusic.qq.com/C4000045NySZ4TNK0x.m4a?guid=2308271380&vkey=4AA5C504348B3C7A4420893C97462BF4870A5EF4E157CA2CE5311D36C7A63BCAF3D5CE44B3CECC9E1385D22B67AC6352BB359D7EE1905D3A&uin=7587&fromtag=66'
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function() {
    this.audioCtx = wx.createAudioContext('myAudio');
  },

  audipplay: function () {
    this.audioCtx.play();
  },
  audippause: function () {
    this.audioCtx.pause();
  },
  audioseek: function () {
    this.audioCtx.seek(60);
  },


  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {
    console.log("show");
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function() {
    console.log("hide");
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function() {
    console.log("unload");
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function() {

  }
})
<video src="https://www.w3school.com.cn/i/movie.ogg" controls></video>
<view>
<audio id="myAudio" poster="{{poster}}" name="{{name}}" author="{{author}}" src="{{src}}" controls></audio>

<button bindtap="audipplay">播放</button>
<button bindtap="audippause">暂停</button>
<button bindtap="audioseek">设置进度条</button>
</view>
  • 1
    点赞
  • 1
    评论
  • 1
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

相关推荐
©️2020 CSDN 皮肤主题: 代码科技 设计师:Amelia_0503 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值