具体化:如何只使用HTML和Javascript制作播放/暂停按钮

Materialize: How to make a play/pause button using nothing but HTML and Javascript?

本文关键字:Javascript 播放 按钮 暂停 HTML 具体化      更新时间:2023-09-26

我想知道如何制作播放/暂停按钮。目前,HTML和JS正在解决这个问题。

我使用了一些其他示例,并创建了这个示例。确保,如果你使用这个,你的HTML音频标签看起来像这个

<audio id="audio_core" autoplay="autoplay">
  <source src="audio/bgm.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

这是按钮本身:

<a href="javascript:void(0)" id="audiobutton" class="btn-floating btn-large waves-effect waves-light red" onclick="aud_play_pause()"><i id="icn" class="material-icons">pause</i></a>
<script>
function aud_play_pause() {
  var myAudio = document.getElementById("audio_core");
  if (myAudio.paused) {
    myAudio.play();
    $("#icn").text("pause");
  } else {
    myAudio.pause();
    $("#icn").text("play_arrow");
  }
}
</script>

希望这能有所帮助!