写一段代码,按下按钮,播放音频,再按一下停止播放
时间: 2023-10-19 14:05:12 浏览: 33
好的,以下是一个简单的示例代码:
HTML部分:
```
<button id="playBtn">播放</button>
<audio id="myAudio" src="audio.mp3"></audio>
```
JavaScript部分:
```
let audio = document.getElementById("myAudio");
let playBtn = document.getElementById("playBtn");
let isPlaying = false;
playBtn.addEventListener("click", function() {
if (isPlaying) {
audio.pause();
playBtn.innerText = "播放";
} else {
audio.play();
playBtn.innerText = "停止";
}
isPlaying = !isPlaying;
});
```
解释一下代码的流程:
1. 获取音频元素和播放按钮元素。
2. 定义一个标志变量 `isPlaying`,表示当前是否正在播放音频。
3. 给播放按钮添加点击事件监听器。
4. 在点击事件处理函数中,根据 `isPlaying` 的值来判断当前是要播放还是停止音频。
5. 如果是播放,就调用 `audio.play()` 方法播放音频,并将按钮文本改为“停止”;如果是停止,就调用 `audio.pause()` 方法停止音频,并将按钮文本改为“播放”。
6. 最后,更新 `isPlaying` 的值,以便下一次点击时能正确地执行对应的操作。