首页 > 其他分享 >html 音频自动播放

html 音频自动播放

时间:2023-03-24 15:32:44浏览次数:34  
标签:playbox document 音频 播放 html 自动播放 audio true

chrome处于安全考虑,不会自动播放音视频,只能与页面有交互后调用播放函数

<!DOCTYPE html>
<html>
<head>
	<title>音乐自动播放</title>
</head>
<body>
	<audio autoplay="autoplay" controls id="playbox">
		<source src="mp3.mp3" type="">
	</audio>
	<script type="text/javascript">
		// 标签audio和audio实例用法一样

		// 实例的用法-------
		// const audio = new Audio();
		// audio.autoplay = true;
		// audio.src = 'mp3.mp3';

		// // 点击任意 播放
		// document.addEventListener('click', () => {
		//  	myplay()
		// },true);

		// function myplay(){
		// 	audio.play()
		// }

		// 标签的用法-------
		const playbox = document.getElementById("playbox")
		// 点击任意 播放
		document.addEventListener('click', () => {
		 	playbox.play()
		},true);
	</script>
</body>
</html>

标签:playbox,document,音频,播放,html,自动播放,audio,true
From: https://blog.51cto.com/u_15668841/6147347

相关文章

  • HTML标签盒模型
    一、自我介绍本人2021年6月参加工作,擅长技术主要有html/css/javaScript/vue/uni等,很懒一直都不想写文章,这是我第一篇博文。二、技术分享盒模型原理行内元素特性:1、无法设置......
  • 聊聊Python中的GIL https://www.cnblogs.com/ArsenalfanInECNU/p/9968621.html
    抄自:https://www.cnblogs.com/ArsenalfanInECNU/p/9968621.htmlGIL的全称是GlobalInterpreterLock,全局解释器锁。因为Python的执行依赖于解释器。Python最初的设计理......
  • 纯CSS和HTML打造树结构
    阅读目录源码HTML源码请到资源下载源码。HTML我们以某个公司的部门组织结构为例,其实就是一个无限级分类,我们首先定义好HTML结构,它有ulli组成,代码应该像这样:<!DOCTYPEhtml>......
  • Html字符转码
    标记十进制编码编码™&#8482; € &euro;Space&#32;&nbsp;!&#33; "&#34;"#&#35; ......
  • 使用html2canvas+jspdf将页面转为pdf并下载
    1、安装html2canvas和jspdfnpminstallhtml2canvasnpminstalljspdf2、新建文件htmlToPdf.ts//导出页面为PDF格式importhtml2Canvasfrom'html2canvas'impor......
  • IU8689带主从模式,145W单声道&2X75W立体声D类音频功放
    IU8689E是一款单声道最高可输出145W,立体声2×75WD类音频放大器;这款器件在顶层设计了散热焊盘,焊盘上连接散热器后在供电电压24V的情况下,最大可以输出2×75W的连续功率;通过主......
  • HTML5
    一、HTML5新整1、新增布局标签artical里面可以有多个section。section强调的是分段或分块,如果你想将一块内容分成几段的时候,可使用section元素。article比......
  • 使用html2canvas+jspdf将页面转为pdf并下载
    需求:我有一个页面,是由多个模块组成的,现在我需要把页面转为pdf并下载,但是因为pdf自动换页以后会把我的模块给截开,不好看甚至内容被裁开,所以我需要判断当前页面加上这个模块......
  • .net core 关于对swagger的UI(Index.html)或接口的权限验证;
    背景:如何在ASP.NetCore的生产环境中保护swaggerui,也就是index.html页面。其实swagger是自带禁用的功能的,只需要设置开关即可。但是有一些场景,是需要把这些接口进行开放......
  • HTML请求错误代码
    HTML请求错误代码 1xx(临时响应) 表示临时响应并需要请求者继续执行操作的状态码。 100(继续)请求者应当继续提出请求。服务器返回此代码表示已收到请求的第一部分......