Abbrechen der aktuellen Sprachäußerung, wenn Benutzer zu einem anderen SVG-Pfad wechselt

Question

Ich habe eine webbasierte Anwendung mit einem Svg. Wenn der Benutzer seinen Finger über den Bildschirm bewegt, werden verschiedene Beschreibungen gegeben, je nachdem, auf welchem ​​Teil der SVG sie sich befinden. Ich möchte jedoch die aktuelle Sprachäußerung abbrechen, wenn sich der Benutzer auf einen anderen SVG-Pfad bewegt. Derzeit wird die Sprachsynthese-API weiterhin die Beschreibung auslesen, selbst wenn sich der Benutzer auf einem anderen Pfad befindet. Der Grund für if ('speechSynthesis' in window) ist so, dass der Rest meines Skripts auf Firefox läuft.

Hier ist meine Sprachsynthesefunktion:

if ('speechSynthesis' in window) { 
    var msg = new SpeechSynthesisUtterance(); 
    var voices = window.speechSynthesis.getVoices(); 
    msg.voice = 'native'; 
    msg.rate = 2; 
} 

....

function vibStart(event) { 
     event.preventDefault(); 
     e = document.elementFromPoint(event.touches.item(0).clientX, event.touches.item(0).clientY); 
     for (var i = 0; i<paths.length +1; i += 1) { 
       if (e.id == "path" + i) { 
          if ('speechSynthesis' in window) { 
          msg.text = document.getElementById("desc" + i).firstChild.data; 
          speechSynthesis.speak(msg); 
          msg.addEventListener('end', function() { 
           speechSynthesis.cancel(); 
          }); 
          } 
       } 
     } 
} 

Gibt es eine Möglichkeit die Rede Text als Variable zu speichern und dann diese gegen die e zu überprüfen. ID und wenn sie gleich sind, die Sprachäußerung zu stornieren?

EDIT

Ich habe versucht, das Hinzufügen speechSynthesis.cancel(); vor msg.text, aber dies nicht lösen entweder das Problem. Während die Äußerung abgebrochen wird, wenn sich der Benutzer auf einen neuen Pfad bewegt, startet er die neue Äußerung nicht sofort.

Answer 1

Entwickeln auf @ Kerstomaat Vorschlag, löste ich mein Problem, indem Sie einfach eine globale Variable namens spoken und setzen Sie es auf null.

Ich änderte dann den Codeblock if ('speechSynthesis' in window) zu beginnen:

('speechSynthesis' in window) { 
    var speech = document.getElementById("desc" + i); 
    if (spoken !== speech) { 
     speechSynthesis.cancel()  
     msg.text = document.getElementById("desc" + i).firstChild.data; 
     speechSynthesis.speak(msg); 
     spoken = speech; 
} 

Dies führte in den Beschreibungen Brennen, wenn Sie ein neuer Weg sind, und für die vorherige Beschreibung Wiedergabe zu beenden. Schien das Problem zu beheben!