首页 微信小程序 小程序开发 微信小程序使用audio组件播放音乐功能示例

微信小程序使用audio组件播放音乐功能示例

May 24, 2018 am 10:57 AM
audio 小程序 播放

前面我们分享过很多关于微信小程序教程,本文我们主要介绍了微信小程序使用audio组件播放音乐功能,结合实例形式分析了微信小程序audio组件播放在线音乐相关操作技巧,并附带源码供读者下载参考,需要的朋友可以参考下,希望能帮助到大家。

1、效果展示

2、关键代码

① index.wxml

复制代码 代码如下:

<audio src="{{audioSrc}}" poster="{{audioPoster}}" name="{{audioName}}" author="{{audioAuthor}}" controls></audio>
登录后复制

② index.js

Page({
 data: {
   audioPoster: &#39;http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000&#39;,
   audioName: &#39;此时此刻&#39;,
   audioAuthor: &#39;许巍&#39;,
   audioSrc: &#39;http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46&#39;,
 }
})
登录后复制

大家学会了吗?赶紧动手自己尝试一下吧。

相关推荐:

微信小程序用户自定义模版的功能实现

实现选项卡功能的微信小程序

最全的微信小程序项目实例

以上是微信小程序使用audio组件播放音乐功能示例的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

如何使用'隔空播放”流式传输视频或镜像 iPhone 或 iPad 屏幕 如何使用'隔空播放”流式传输视频或镜像 iPhone 或 iPad 屏幕 Jul 14, 2023 pm 07:53 PM

本快速指南将向您展示如何使用AirPlay,这是Apple的创新无线流媒体功能,可以轻松共享和显示内容。允许您使用Wi-Fi将iPhone或iPad连接到与AirPlay兼容的AppleTV、智能电视、扬声器和Mac以及某些第三方扬声器和智能电视,以实现无缝数据传输。“隔空播放”以点对点为基础运行,通过本地网络连接您的Apple设备。它使用多种技术的组合,包括用于流式传输音频和视频的实时传输协议(RTP)和用于设备发现的Bonjour。简而言之,当您使用“隔空播放”时,您的设备会发送数据流,然后

使用Python开发微信小程序 使用Python开发微信小程序 Jun 17, 2023 pm 06:34 PM

随着移动互联网技术和智能手机的普及,微信成为了人们生活中不可或缺的一个应用。而微信小程序则让人们可以在不需要下载安装应用的情况下,直接使用小程序来解决一些简单的需求。本文将介绍如何使用Python来开发微信小程序。一、准备工作在使用Python开发微信小程序之前,需要安装相关的Python库。这里推荐使用wxpy和itchat这两个库。wxpy是一个微信机器

飞傲CP13卡带播放器上市,透明复古外观 飞傲CP13卡带播放器上市,透明复古外观 Jun 16, 2024 am 09:52 AM

Fii OCP13 盒式录音机于 1 月发布。现在,Fii O 正在扩大其产品组合,推出两款新型号 - 一款带有红色正面,一款带有透明正面。后者不仅完美匹配了棱角设计的复古魅力,而且

Soundcore Space One Pro:Anker 推出迄今为止最昂贵的耳罩式耳机 Soundcore Space One Pro:Anker 推出迄今为止最昂贵的耳罩式耳机 Jun 26, 2024 pm 03:07 PM

Anker 提供广泛的产品组合,不仅包括各种产品类别,而且每个类别中都有众多产品。音频产品在这方面也不例外,Anker 提供非常实惠的耳机以及

Klipsch 推出 Flexus Core 300 旗舰条形音箱,支持 8K、12 个扬声器和房间校正 Klipsch 推出 Flexus Core 300 旗舰条形音箱,支持 8K、12 个扬声器和房间校正 Sep 05, 2024 am 10:16 AM

Klipsch Flexus Core 300 是该系列中的顶级型号,在该公司的条形音箱系列中位于现有的 Flexus Core 200 之上。根据 Klipsch 的说法,这是世界上第一款声音可以适应现实的条形音箱。

实现微信小程序中的卡片翻转特效 实现微信小程序中的卡片翻转特效 Nov 21, 2023 am 10:55 AM

实现微信小程序中的卡片翻转特效在微信小程序中,实现卡片翻转特效是一种常见的动画效果,可以提升用户体验和界面交互的吸引力。下面将具体介绍如何在微信小程序中实现卡片翻转的特效,并提供相关代码示例。首先,需要在小程序的页面布局文件中定义两个卡片元素,一个用于显示正面内容,一个用于显示背面内容,具体示例代码如下:&lt;!--index.wxml--&gt;&l

支付宝上线'汉字拾光-生僻字”小程序,用于征集、补充生僻字库 支付宝上线'汉字拾光-生僻字”小程序,用于征集、补充生僻字库 Oct 31, 2023 pm 09:25 PM

本站10月31日消息,今年5月27日,蚂蚁集团宣布启动“汉字拾光计划”,最近又迎来新进展:支付宝上线“汉字拾光-生僻字”小程序,用于向社会征集生僻字,补充生僻字库,同时提供不同的生僻字输入体验,以帮助完善支付宝内的生僻字输入方法。目前,用户搜索“汉字拾光”、“生僻字”等关键词就可以进入“生僻字”小程序。在小程序里,用户可以提交尚未被系统识别录入的生僻字图片,支付宝工程师在确认后,将会对字库进行补录入。本站注意到,用户还可以在小程序体验最新的拆字输入法,这一输入法针对读音不明确的生僻字设计。用户拆

Audio是指什么 Audio是指什么 Dec 25, 2023 pm 03:41 PM

Audio是指声音的波长、频率和强度。它是一种可以被人类听觉系统感知的信号,由物体振动产生。音频通常以波形的方式存在,可以记录、存储、传输和重放。,音频是一种重要的多媒体信息,在各种领域中得到应用。随着数字技术的发展,数字音频已经成为现代音乐制作和广播领域中的主流技术。同时,音频处理和数字化也是现代音频技术的重要方向之一,它们可以改善音质、提高声音清晰度、增强声音表现力等。

See all articles