播放/暂停按钮HTML5音频

Question

我试图让HTML5音频在一个按钮上播放/暂停.我怎么会这样做呢？所以播放按钮切换到暂停图标,字体很棒'fa fa-pause'代码在这里:

<audio id="myTune">
<source src="http://96.47.236.72:8364/;">
</audio>
<div class="btn-group btn-group-xs">
<a href="javascript:void(0)" class="btn btn-default" data-toggle="tooltip" title="Preview"     onclick="document.getElementById('myTune').play()"><i class="fa fa-play"></i></a>

谢谢!

Answer 1

您可以将id添加到<i>标记中,并fa fa-pause在更改状态时分配类:

<a href="javascript:void(0)" class="btn btn-default" data-toggle="tooltip" title="Preview" onclick="aud_play_pause()"><i id="stateicon" class="fa fa-play"></i></a>

<script>
  function aud_play_pause() {
    var myAudio = document.getElementById("myTune");
    if (myAudio.paused) {
      $('#stateicon').removeClass('fa fa-play');
      $('#stateicon').addClass('fa fa-pause');
      myAudio.play();
    } else {
      $('#stateicon').removeClass('fa fa-pause');
      $('#stateicon').addClass('fa fa-play');
      myAudio.pause();
   }
 }

希望这可以帮助