有没有办法在html中自动播放音频?

2024-01-18

我想在打开网站时立即在网站中自动播放音频。但这不起作用。

  <audio id="myAudio" autoplay>
  <source src="./Welcome to Kitchen Nightmares..mp3" type="audio/ogg">
  <source src="./Welcome to Kitchen Nightmares..mp3" type="audio/mpeg">
  </audio>
  <script>
    function myFunction() {
      var x = document.getElementById("myAudio").autoplay;
      document.getElementById("demo").innerHTML = x;
    }
    myFunction();

应该在页面加载时开始播放音频文件,这要归功于autoplay属性上的<audio>元素。 HTML 代码中的按钮允许您通过调用来控制音频播放play() and pause()上的方法<audio>元素。

请注意,出于用户体验和安全考虑,某些浏览器可能不允许音频在网站上自动播放。在这些情况下,用户可能需要通过单击页面上的按钮或其他元素来显式启动音频播放。

<audio id="myAudio" autoplay>
  <source src="./Welcome to Kitchen Nightmares..mp3" type="audio/ogg">
  <source src="./Welcome to Kitchen Nightmares..mp3" type="audio/mpeg">
</audio>

<p>
  <button onclick="playAudio()">Play Audio</button>
  <button onclick="pauseAudio()">Pause Audio</button>
</p>

<script>
  function playAudio() {
    var audio = document.getElementById("myAudio");
    audio.play();
  }

  function pauseAudio() {
    var audio = document.getElementById("myAudio");
    audio.pause();
  }
</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

有没有办法在html中自动播放音频? 的相关文章

  • Facebook 自定义故事与大图像 - 使用 Javascript 打开图

    我正在尝试创建一个自定义故事 每次有人尝试发布它时都会有一个新图像 现在我创建了一个对象 以及将两者结合起来的动作和故事 我想要实现的是一个看起来像这样的故事https fbcdn dragon a akamaihd net hphotos
  • AngularJS:选择非 2 路绑定到模型

    我正在使用选择来显示客户名称 用户应该能够选择现有客户端 然后更新范围属性 控制器 初始化 首选 if scope clients length gt 0 scope existingClient scope clients 0 View
  • 我需要一个 jQuery Autocomplete 使用 ajax 返回 id 和 name 的示例

    我需要一个示例 说明如何编写 jQuery 自动完成代码来填充product id 同时显示调用ajax 页面 remote php 的product name
  • 未捕获的类型错误:无法读取未定义的属性“prop”

    我有 6 个输入复选框 如果选中的复选框超过 3 个 则最后一个复选框将被取消选中 为了更好地理解 请参阅我之前的question https stackoverflow com questions 35195235 if checkbox
  • 如何在美人鱼节点描述中添加链接?

    我想 如下图所示 div class mermaid graph TD A hello B an b important b link A gt B div 在下面添加实际链接link指向http google com 我尝试将相关节点修改
  • Browserify:如果需要,使用 module.exports,否则暴露全局

    我正在考虑采用浏览器化 http browserify org 对于我的一些项目 但想确保其他人如果想使用 捆绑的 代码就不必使用 browserify 执行此操作的明显方法是通过以下方式公开模块导出module exports以及通过一个
  • 在移动网站中处理 iPhone 事件(如向左滑动)

    iPhone 浏览器是否有可以使用 Javascript 挂钩的特殊事件 例如 如果用户向左滑动 我想执行某个操作 如果有类似的活动 很高兴看到所有这些活动的参考 理想情况下 有一天所有触摸屏移动浏览器都会有一个标准 您可以访问多点触控事件
  • 如何在html中设置按钮的文本大小

    您好 我想在我的网站上有一个按钮 并且我想调整按钮上的文本大小 我该怎么做呢 我的代码如下
  • Rails 中的 PDF 导出

    我需要将包含一些图表的 HTML 页面导出为 PDF 有哪些好的 gem 可以做到这一点 PDFKit http railscasts com episodes 220 pdfkit http railscasts com episodes
  • Onblur 事件在另一个 div 的 onclick 之前触发

    如上所述 我有一个按钮 单击该按钮将打开子菜单 对于子菜单中的每个选项 都有三个元素 我认为实际上还有更多元素 但为了简单起见 将其保留为 3 我将焦点放在子菜单的主 div 白色 框架 上 Onblur 这个 div 然后我隐藏子菜单 这
  • CSS 动画自定义属性/变量

    一段时间以来我一直在努力让它发挥作用 关键是内部 div 将具有某种形状 并且可能会不止一个 这就是为什么我使用nth child选择器 这个内部 div 应该显示然后再次隐藏一段时间 问题是 我想在一个动画中为所有 后来的 多个内部 di
  • 适用于多应用项目的 Grunt 和 requirejs 优化器

    我在让 Grunt 对具有以下结构的项目执行 requirejs 优化时遇到问题 static js apps app js dash js news js many more app files build collections lib
  • Socket.io 与服务器离线连接

    如何检测服务器是否离线或由于其他原因无法连接 我的代码看起来像这样 this socket io connect connectionInfo reconnect false 它不会抛出任何错误 因此 try catch 子句不起作用 Us
  • Angular 停止 Enter 键提交

    I am trying to stop the Enter from submitting my button and rather make it point to another function I tried trapping th
  • 响应式2列2行布局

    我一直在试图弄清楚如何创建这个布局 我有一个 2 列布局 左列有 1 行 右侧有 2 行 我试图让它流畅地调整 我遇到的问题是 我希望右侧顶部图像的顶部与左侧图像的顶部对齐 而底部图像的底部与左侧图像的底部保持对齐 我应该使用桌子吗 这是我
  • 有没有办法从画布上清除一个元素而不消除其他元素?

    我正在使用画布构建页面加载器 并使用 es6 类 虽然目前我无法使其正常工作 原因之一是我找不到清除画布的方法进展 到目前为止 这是我的代码 class Loader constructor width height this width
  • JavaScript 正则表达式两个标签之间的多行文本

    我编写了一个正则表达式来从 HTML 中获取字符串 但似乎多行标志不起作用 这是我的模式 我想将文本输入h1 tag var pattern div class box content 5 h1 lt lt h1 gt mi m html
  • 将下拉按钮和下拉菜单放在中心?

    div class dropup center block div
  • 用 Beautiful Soup 进行抓取:为什么 get_text 方法不返回该元素的文本?

    最近我一直在用 python 开发一个项目 其中涉及抓取一些网站的一些代理 我遇到的问题是 当我尝试抓取某个知名代理站点时 当我要求 Beautiful Soup 查找 IP 在代理表中的位置时 它并没有按照我的预期执行操作 我将尝试查找每
  • JavaScript 中“键”的类型是什么?

    当我失去焦点并开始思考一个愚蠢的问题时 我遇到了这样的时刻 var a b value b 的类型是什么 我的意思不是 值 的类型 而是标记为 b 的实际键 背景 当我必须创建一个字符串键时 我开始想知道这一点 var a b value

随机推荐

  • backbone.js 用 CoffeeScript 保存

    我在咖啡脚本中定义的主干视图上有以下方法 saveObservation gt self observation new Observation ParentUid questionUid Status N a Text Change to
  • 如何使用分布排序(基数排序等)对字符串进行排序?

    我知道如何使用基数排序对整数进行排序 但如何使用它来对字符串进行排序呢 或者浮点数 如果您忽略浮点数的一些特性 例如无穷大 非数字值和零的两种不同表示形式 则可以使用基数排序或任何其他分布排序对浮点数进行排序 IEEE 754 2008 h
  • 与 GCC 和 -lm 链接不会在 Ubuntu 上定义 ceil()

    我目前正在使用GCC编译 我需要使用
  • 哪个 paypal api 可以获取所有交易

    对大量 paypal API 感到非常困惑 我想知道我是否可以以某种方式获取交易 输入和输出 就像我通过网络界面导出到 csv 一样 我在这里 REST API https github com paypal PayPal Ruby SDK
  • 加载sequelize中关系为空的项目

    我是续集的新手 我正在尝试加载用户表中任务关系为空的所有条目 但它不起作用 这是我尝试过的 const express require express const app express const Sequelize require se
  • 从mysql的大表中快速选择随机行

    从大型 mysql 表中选择随机行的快速方法是什么 我正在使用 php 工作 但我对任何解决方案都感兴趣 即使它是另一种语言 获取所有 id 从中随机选择一个 然后检索整行 如果您知道 id 是连续的且没有漏洞 则可以获取最大值并计算随机
  • 如何阻止 Spring 吞咽异常?

    当服务器端出现故障时 因为数据库和应用程序不同步 而不是出现错误 并且应用程序崩溃 spring tomcat 似乎会吞下异常并假装什么也没发生 你可以说我疯了 但如果程序灾难性地失败 我希望它实际上灾难性地失败 有什么办法可以关闭这种行为
  • Pygame.MOUSEBUTTONDOWN 坐标关闭,除非我在 xwindows 中

    如果我从控制台加载 pygame 代码 它会错误地读取触摸屏坐标 但如果我启动到 xwindows 它会正确读取它们 我已经进入并校准了触摸屏 如果我从控制台运行 evtest 我将得到正确的坐标 只有在 python 中 它才会返回错误的
  • 监听EventDispatcher的所有事件类型

    在Flex中 是否可以监听一个对象的所有事件类型IEventDispatcher addEventListener的第一个参数是类型 它是一个字符串 在许多情况下 文档并不清楚它触发的事件类型 我想附加一个通用侦听器来检查事件 我认为你必须
  • 我可以在 ANDROID 中将 mp3 文件转换为文本吗?

    Android 是否支持以下功能 将包含语音的 mp3 文件转换为适当的单词 然后将结果写入 TextView 或 Toast 或其他任何内容 我不是在谈论使用语音识别器 我的意思是 mp3 中的文件必须从 SD 中选取 未实时记录和分析
  • 谷歌地图v3更改信息窗口的大小

    我想设置信息窗口的大小以适合其中的内容 标准信息窗口太宽我尝试使用 maxWidth 但它似乎不起作用 调整信息窗口大小的最佳方法是什么 参见代码 window setContent inspStates i name br total i
  • 如何在Javascript中为小数添加小数点

    我尝试将 0 10 添加到 23 50 但得到 23 50 10 而不是 23 60 my code console log parseFloat 23 50 parseFloat Math random 0 10 0 01 toFixed
  • Nativebase - 单击输入时如何显示日期选择器?

    我在用本地库成分 我有Form具有以下字段
  • 在 onTouch (Android) 上获取颜色(像素)信息

    有没有办法获取像素 x y 的颜色并检查其是否为红色 如果是红色则发送触摸事件 我希望它在后台运行 并且它应该始终检查该像素 x y 的颜色 一旦它变成红色 就应该模拟触摸事件 您可以从以下示例中获取值 final Bitmap bitma
  • 在 BigQuery 中附加时忽略重复记录

    我们正在将数据从 MySql 写入 BigQuery 我们设定了一些指标 例如 插入 如果是第一次添加记录 则在指示符字段中用 I 保存 更新 如果记录有一些更新的数据 则在 指示符 字段中将其保存为 U 如果未更改则忽略重复记录 但在 更
  • Winnovative - CSS 网格未正确转换

    我正在使用 Winnovative 库将一些 HTML 转换为 PDF 由于这对于很多场景都很有效 但 CSS 网格似乎存在问题 由于我无法分享太多规格 但我可以分享这些显示 HTML 部分和 PDF 中转换结果的图像 HTML eleme
  • 在 WCF 中,我的 UriTemplate 的文字段中可以有通配符吗?

    我正在使用 Net 4 0 编写 RESTful WCF 服务 我想要以下两个网址 root document ids fields fields root externaldocument ids fields fields 映射到相同的
  • applicationContext.xml 中的 beans 声明

    我有一个关于类声明的问题应用程序上下文 xml In 应用程序上下文 xml我们需要指定应用程序中的所有类吗 例如 在我的小型网络应用程序中 我有一个Entity class Service类和DAO班级 所以目前它被定义为
  • 找出 Google Cloud SDK 的安装位置

    我需要在以下位置添加 Google Cloud SDKPATH 所以我需要安装位置的路径 有没有gcloud 哪个命令给我这个信息 如果不是 我必须通过符号链接which gcloud etc 对于这个问题有更清洁的解决方案吗 以下命令将为
  • 有没有办法在html中自动播放音频?

    我想在打开网站时立即在网站中自动播放音频 但这不起作用