如何暂停/停止播放音频并替换为新的音频文件

Question

因此，当用户单击某个按钮时，音频文件将播放一系列音频文件（大约2秒的剪辑），这很好。但是，如果用户反复点击该按钮，则音频文件开始相互播放。理想情况下，我想停止/暂停先前的音频文件，然后播放新的音频文件。这是我一直试图利用：

$scope.sounder=function(){ 


$scope.rs=$scope.diff[$scope.workout_index].audiorep; 
$scope.ms=$scope.diff[$scope.workout_index].audiomove; 

    //var movesound = new Audio ($scope.ms); 
    //ar repsound = new Audio ($scope.rs); 

    var movesound = new Media($rootScope.getMediaURL($scope.ms)); 
    var repsound = new Media($rootScope.getMediaURL($scope.rs)); 

    if($scope.muter==0){ 



     movesound.pause();//DOES NOT WORK 
     movesound.stop();//STOPS ALL AUDIO FROM PLAYING, SO NOTHING PLAYS 

     $timeout(function() { 
     movesound.play(); 
     }, 1000); 

     $timeout(function() { 
     repsound.play(); 
     }, 3000); 

    } 

    if($scope.muter==1){ 
    console.log("Rachel has been muted"); 
    return; 
    } 
} 

Answer 1

您可以的JavaScript实现的功能在科尔多瓦除非特别需要AngularJS在您的应用程序。

<audio controls id="myAudio"> 
    <source src="horse.ogg" type="audio/ogg"> 
    <source src="horse.mp3" type="audio/mpeg"> 
    Your browser does not support the HTML5 audio tag. 
</audio> 

现在使用脚本来添加相应的功能 -

<script> 
var aud= document.getElementById("myAudio"); 

function playAud() { 
    aud.play(); 
} 

function pauseAud() { 
    aud.pause(); 
} 

function myFunction() { 
    isSupp = aud.canPlayType("audio/mp3"); 
    if (isSupp == "") { 
    aud.src = "audio.ogg"; 
    } else { 
    aud.src = "audio.mp3"; 
    } 
    aud.load(); 
} 
</script> 

参见改变音频源的JavaScript this问题答案。

有关更多属性和功能，请参阅w3schools HTML Audio Video DOM reference Page。