html5插入audio标签,点击播放键无法播放,怎么解决

<style>
.article-audio {
        width: 1000px;
        margin: 32px auto;
        padding:0;
        }
</style>
<!-- 文章音频 -->
    <div class="article-audio">
        <audio  controls="controls">
            <source src="./15cf2f2ecf6d8548a54553c662e19f42-3636283457c44c0f9e4e00eebb7ae9e2-1.mp3"> 
            <source src="./15cf2f2ecf6d8548a54553c662e19f42-3636283457c44c0f9e4e00eebb7ae9e2-1.wav">
            您的浏览器不支持audio标记(元素)
        </audio>
    </div>

![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/019789312686124.png "#left")


source 后面得加上 type 属性才行
复制代码 替换你的代码试下 , 如有帮助给个采纳谢谢

 
<div class="article-audio">
   <audio  controls="controls">
      <source src="./15cf2f2ecf6d8548a54553c662e19f42-3636283457c44c0f9e4e00eebb7ae9e2-1.mp3" type="audio/mpeg"> 
      <source src="./15cf2f2ecf6d8548a54553c662e19f42-3636283457c44c0f9e4e00eebb7ae9e2-1.wav" type="audio/wav">
            您的浏览器不支持audio标记(元素)
        </audio>
    </div>

<audio controls="controls" loop="loop">
    <source src="audio/极乐净土.mp3" type="audio/mp3"></source>
</audio>

你的浏览器不支持audio标记(元素)?

这个我知道,需要更新DOM 你可以私信我 给你看我的项目代码

这个问题可能是因为浏览器不支持audio标签的格式所导致的。你可以尝试更改音频文件的格式,或者添加更多的

标签,以支持更多的浏览器。同时,你也可以检查一下音频文件的路径是否正确。如果问题仍然存在,你可以尝试使用第三方的音频播放器插件,如jPlayer等。

根据您提供的代码和截图,我们发现在<source>标记中指定了.mp3.wav类型的音频,这是为了确保在不同的浏览器和系统上播放音频时都有文件可供使用。但是,您没有指定type属性的值,因此浏览器可能无法正确确定音频类型,这可能会导致播放失败。

为了解决这个问题,请在<source>标签中指定type属性的值。这将帮助浏览器正确确定音频类型并使用正确的文件进行播放。例如,如果您的音频文件是MP3格式,则应将type属性设置为“audio/mpeg”。

请尝试使用以下代码替换您的HTML代码,看看是否可以解决问题:

<div class="article-audio">
  <audio controls>
    <source src="./15cf2f2ecf6d8548a54553c662e19f42-3636283457c44c0f9e4e00eebb7ae9e2-1.mp3" type="audio/mpeg">
    <source src="./15cf2f2ecf6d8548a54553c662e19f42-3636283457c44c0f9e4e00eebb7ae9e2-1.wav" type="audio/wav">
    您的浏览器不支持 audio 元素。
  </audio>
</div>

另外,请确认音频文件是否存在,并已在网站上正确设置文件路径。如果文件不存在或路径不正确,则可能会导致无法播放音频。


<div class="article-audio">
        <audio  controls="controls">
            <source src="./15cf2f2ecf6d8548a54553c662e19f42-3636283457c44c0f9e4e00eebb7ae9e2-1.mp3" type="audio/mpeg"> 
            <source src="./15cf2f2ecf6d8548a54553c662e19f42-3636283457c44c0f9e4e00eebb7ae9e2-1.wav" type="audio/wav">
            您的浏览器不支持audio标记(元素)
        </audio>
    </div>