Javascript für Einstellungsintervalle

Question

Ich habe eine mp3-Datei, die ich von Punkt A zu Punkt B wiederhole. Ich setze Intervalle für die Start- und Endzeit, aber wenn ich Pause drücke, hält es an, bis sich die Funktion wiederholt. Wie kann ich das Javascript anhalten und die Funktion vollständig anhalten?

var audio = document.getElementById('testPlayer'); 
setInterval(function play1(){ 
    audio.currentTime = 7; 
    audio.play(); 
    int = setInterval(function() { 
     if (audio.currentTime > 100) { 
      audio.pause(); 
      clearInterval(int); 
     } 
    }, 10); 
}, 7000); 
function pause(){ 
    audio.pause(); 
} 

Vielen Dank für Ihre Hilfe im Voraus.

Answer 1

Sie müssen einer Variablen ein Intervall zuweisen, um sie zu löschen.

Versuchen Sie, diese Zugabe:

var play1interval = setInterval(function play1(){ 
    ... 
    if (audio.currentTime > 100) { 
     audio.pause(); 
     clearInterval(int); 
     clearInterval(play1interval); 
    } 
    }, 10); 
}, 7000); 

Darüber hinaus können Sie ein Intervall sagen, eine Funktion zu verweisen, anstatt sie direkt in hinzufügen zu müssen.

function play1(){ 
    ... 
} 

function interval(){ 
    var int = setInterval(play1, 10); 
} 

var play1interval = setInterval(interval, 7000); 

Was nicht notwendig ist, macht nur Dinge einfacher zu lesen.

Answer 2

Wie bekomme ich das Javascript zu pausieren und die Funktion vollständig zu stoppen?

Verwenden Sie nicht setInterval. Es gibt eine Reihe von Ereignissen, die Sie verwenden können, die <audio> auslösen wird.

Mit dem Ereignis timeupdate kann eine einfache Schleife erstellt werden.

document.querySelector('audio').addEventListener('timeupdate', function (e) { 
 
    if (e.target.currentTime > 6) { 
 
    e.target.currentTime = 0; 
 
    } 
 
}, false);

<audio src="http://167.88.156.219/phc/2016/04/30/phc_20160430_128.mp3" controls autoplay></audio>

_{ich dies nur in Chrom getestet haben, so werde ich als Übung Cross-Browser-Implementierung lassen für den Leser}