播放/暫停按鈕HTML5音頻

我試圖讓HTML5音頻在一個按鈕中播放/暫停。我怎麼可能會這樣做呢？所以播放按鈕切換到暫停圖標，這是字體真棒'fa fa-pause'代碼在這裏：播放/暫停按鈕HTML5音頻

<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>

謝謝！

來源

2014-06-30 user3067306

你可以把一個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(); 
    } 
}

希望這有助於

來源

2014-06-30 20:59:56 martinezjc

壞這隻WOR ks爲一個球員的頁面。 – X9DESIGN

我在一個頁面上對多個玩家進行了一些更改。檢查下面的答案。 – X9DESIGN

這給一掄：

function aud_play_pause() { 
 
    var myAudio = document.getElementById("myTune"); 
 
    if (myAudio.paused) { 
 
    myAudio.play(); 
 
    } else { 
 
    myAudio.pause(); 
 
    } 
 
}

<audio id="myTune" src="http://www.rachelgallen.com/HappyBirthday.mp3"></audio> 
 

 

 
<button type="button" onclick="aud_play_pause()">Play/Pause</button>

來源

2014-06-30 20:50:44

這裏有版本供玩家

HTML

<a href="javascript:void(0)" onclick="aud_play_pause(this)"> 
    <i class="control icon-play"></i> 
    <audio class="xnine-player" src="/path/to/file#1.mp3" preload="auto"></audio> 
</a> 

<a href="javascript:void(0)" onclick="aud_play_pause(this)"> 
    <i class="control icon-play"></i> 
    <audio class="xnine-player" src="/path/to/file#2.mp3" preload="auto"></audio> 
</a>

的多個實例JAVASCRIPT

<script> 
    function aud_play_pause(object) { 
     var myAudio = object.querySelector(".xnine-player"); 
     var myIcon = object.querySelector(".control"); 
     if (myAudio.paused) { 
      myIcon.className = "control icon-pause"; 
      myAudio.play(); 
     } else { 
      myIcon.className = "control icon-play"; 
      myAudio.pause(); 
     } 
    } 
</script>

...

來源

2016-12-02 13:30:14 X9DESIGN

播放/暫停按鈕HTML5音頻

回答

相關問題