JavaScript自动播放背景音乐

2023-05-16

问题描述

js控制audio自动播放音乐时报错:

Uncaught (in promise) DOMException

播放音乐报错-201992704146

我的报错之前的代码:

<audio id="myaudio" src="assets/audio/芒种.mp3" controls="controls"  loop="true" hidden="true">
</audio>
$(function () {
    var myAuto = document.getElementById('myaudio');
    myAuto.play();
})

网上搜原因说是:

这是因为,Chrome只允许用户对网页进行主动触发后才可自动播放音频和视频。其实,严格地来说,是Chrome不允许在用户对网页进行触发之前播放音频,而视频其实是不受限制的。但因为视频文件同样包含了音频,所以也一同被禁止了。Chrome这样做的目的是为了防止开发者滥用自动播放功能而对用户产生骚扰。

内容来源于:http://www.nooong.com/docs/chrome_video_autoplay.htm

解决办法:

在上面的html代码中加入autoplay,如下:

<audio id="myaudio" src="assets/audio/芒种.mp3" controls="controls" autoplay loop="true" hidden="true">
</audio>

然后就可以正常播放了,我的Chrome版本:

浏览器版本-201992705022

完成

如果喜欢的话,欢迎关注weyoung公众号...

 

转载于:https://www.cnblogs.com/nelucifer/p/11595429.html

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JavaScript自动播放背景音乐 的相关文章

随机推荐

  • STM32F103ZET6的中断管理

    1 STM32的中断 STM32的中断管理是属于内核部分的 xff0c 所以中断管理的寄存器也是属于内核组 xff0c 不属于芯片外设 xff0c 在查看相关资料的时候 xff0c 需要查看相对应的内核手册 STM32F103ZET6是Co
  • c语言strrchr()函数,C 库函数 – strrchr() ——jQuery中文网

    C 库函数 strrchr 描述 C 库函数 char strrchr const char str int c 在参数 str 所指向的字符串中搜索最后一次出现字符 c 一个无符号字符 的位置 声明 下面是 strrchr 函数的声明 c
  • 让我持续下去的理由

    牛仔裤 格子衬衫 运动鞋和双肩包 如果把这四个词放在一个人的身上 xff0c 似乎不用描述长相 xff0c 大家就对他的职业有了猜测 八成是个程序员吧 这个被笑称 月入五万过成月入五千样子 的群体 xff0c 以 收入高 脑回路简单 一成不
  • 一个工作多年的嵌入式工程师漫谈

    1 关于公司 公司是做什么的 xff1f 是属于项目型公司还是属于产品型公司 xff1f 我觉得公司分为两种 xff0c 一种做产品 xff0c 一种做项目 做产品的公司 xff0c 老板一般都会讲梦想 xff0c 情怀 梦想是什么 xff
  • 优秀APP启动页的设计思维

    一 APP启动项的定义 启动APP时 xff0c 第一画面一般都会是一张含有logo的图片 这张图片就叫做启动页面 二 APP启动页的设计方法 启动页设计要与主界页面要相似 xff0c 颜色 xff0c 风格等都不要有太大的跨度 xff0c
  • GAAS installlation on Ubuntu 18.04

    GAAS installlation on Ubuntu 18 04 GAAS 安装教程 xff1a document GAAS 中的安装教程中提到的 ROS Kinetic xff08 LTS 版 xff09 并不是最新的版本 xff0c
  • Django使用request和response对象

    size 61 large url http iluoxuan iteye com blog 1738522 url size 当请求一张页面时 xff0c Django把请求的metadata数据包装成一个HttpRequest对象 xf
  • 去哪儿网2015校招研发类笔试题

    从网上找到的题目 xff0c 自己做了一遍 1 二分查找 2 给定一个字符串 xff0c 得到这个字符串中首先出现两次的那个字符 方法 xff1a 可以用一个hash map或者数组来存储字符出现的次数 xff0c 一旦有一个出现了2次 x
  • 如何查看mysql镜像参数_Docker中查看Mysql数据库中的各环境参数

    通过官方的文档可以看到运行MySQL容器的命令是 xff1a docker run name some mysql e MYSQL ROOT PASSWORD 61 mypwd d mysql tag 如 xff1a docker run
  • 趣味离散数学题(巧猜围棋子)

    甲手里有一个围棋子 xff0c 要乙来猜棋子的颜色是白的还是黑的 xff0e 条件是 xff1a 只允许乙问一个只能回答 是 或 否 的问题 xff0c 但甲可以说真话 xff0c 也可以说假话 xff0e 问乙可以向甲提出一个什么问题 x
  • nrm安装与使用

    一 什么是nrm nrm 是一个 npm 源管理器 xff0c 允许你快速地在 npm源间切换 什么意思呢 xff0c npm默认情况下是使用npm官方源 xff08 使用npm config ls命令可以查看 xff09 xff0c 在国
  • Docker中的Dockerfile命令详解FROM RUN COPY ADD ENTRYPOINT...

    Dockerfile指令 这些建议旨在帮助您创建高效且可维护的Dockerfile FROM FROM指令的Dockerfile引用 尽可能使用当前的官方图像作为图像的基础 我们推荐Alpine图像 xff0c 因为它是严格控制的并且尺寸小
  • 视觉单词模型、词袋模型BoW

    多用于图像检索 分类 3 2 1 4 视觉单词模型 视觉词袋 xff08 BoVW xff0c Bag of Visual Words xff09 模型 xff0c 是 词袋 xff08 BoW xff0c Bag of Words xff
  • 卡尔曼滤波器推导与解析 - 案例与图片

    在SLAM的后端优化中有存在这两大类优化方法 滤波器优化和非线性优化 目前大多数基于视觉的SLAM算法都是采用的非线性优化的相关方法 如应用较多的G2O图优化框架 但是滤波器的方法仍然在某些情况下有应用 且以前不少论文都是基于滤波器优化的方
  • Ubuntu下使用USB串口接收数据

    环境 xff1a VMware xff0c Ubuntu 14 xff0c uBlox EVK M8L 1 把包含USB接口的uBlox插入PC中 xff0c 确定虚拟机右下角uBlox连接到虚拟机中 xff1b 2 在Ubuntu的终端中
  • docker ubuntu桌面

    docker run it rm p 8080 80 dorowu ubuntu desktop lxde vnc 转载于 https www cnblogs com fengjian2016 p 11417340 html
  • 三种蓝牙架构实现方案(蓝牙协议栈方案)

    蓝牙架构实现方案有哪几种 xff1f 我们一般把整个蓝牙实现方案叫做蓝牙协议栈 xff0c 因此这个问题也可以这么阐述 xff1a 蓝牙协议栈有哪些具体的架构方案 xff1f 在蓝牙协议栈中 xff0c host是什么 xff1f cont
  • linux 与 单片机 串口通信

    本人最近在尝试在linux下用串口与单片机通信 xff0c 虽然说网上资料例程五花八门 xff0c 但是缺乏严格的注释或者完整的实例 xff0c 或许本人能力有限 xff0c 某些问题无法理解 xff0c 在实际过程中遇到不少问题 xff0
  • 【异常】postman能够请求成功获取到参数,前端请求的却请求不到

    1 前端联调的时候 xff0c 反馈自己的参数没有生效 xff0c 无论传递任何参数都是一样的结果 盯了一下日志发现 postman请求的是 34 getParameter 34 34 provinceCode 34 34 11 34 34
  • JavaScript自动播放背景音乐

    问题描述 js控制audio自动播放音乐时报错 xff1a Uncaught in promise DOMException 我的报错之前的代码 xff1a code lt audio id 61 34 myaudio 34 src 61