問題

私はHTML5オーディオを1つのボタンで再生/一時停止させようとしています。どうすればこのことをやり遂げることができますか?したがって、再生ボタンは、すばらしいフォント「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>
 

ありがとうございました!

  ベストアンサー

<i> タグに id を入れ、状態の変更時に 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();
   }
 }
 

これが役立つことを願って

  同じタグがついた質問を見る

javascriptjqueryhtmlaudiohtml5-audio