HTML 如何停止使用 HTML5 的 audio 标签播放音频

在本文中，我们将介绍如何通过使用 HTML5 的 audio 标签来停止播放音频。HTML5 的 audio 标签可以方便地在网页中嵌入音频，并提供了一些方法来控制音频的播放和暂停。

阅读更多：HTML 教程

设置音频文件

首先，我们需要定义音频文件。可以通过在 audio 标签中使用 src 属性来指定音频文件的路径。例如，下面的代码示例定义了一个名为 audio.mp3 的音频文件。

<audio src="audio.mp3"></audio>

控制音频的播放与暂停

使用 HTML5 的 audio 标签可以方便地控制音频的播放和暂停。通过 JavaScript，我们可以通过 play() 方法开始播放音频，并通过 pause() 方法暂停音频的播放。

<audio id="myAudio" src="audio.mp3"></audio>

<button onclick="playAudio()">播放</button>
<button onclick="pauseAudio()">暂停</button>

<script>
  var audio = document.getElementById("myAudio");

  function playAudio() {
    audio.play();
  }

  function pauseAudio() {
    audio.pause();
  }
</script>

在上面的代码示例中，我们创建了有两个按钮的页面。当点击播放按钮时，调用 playAudio() 函数，通过 play() 方法开始播放音频。而当点击暂停按钮时，调用 pauseAudio() 函数，通过 pause() 方法暂停音频的播放。

中止音频的播放

如果我们想要中止音频的播放，而不仅仅是暂停，可以使用 currentTime 属性将音频的当前播放位置设置为音频的持续时间。

<audio id="myAudio" src="audio.mp3"></audio>

<button onclick="stopAudio()">停止</button>

<script>
  var audio = document.getElementById("myAudio");

  function stopAudio() {
    audio.currentTime = audio.duration;
  }
</script>