SpeechSynthesisUtterance: end event
{{APIRef("Web Speech API")}}
The end event of the Web Speech API {{domxref("SpeechSynthesisUtterance")}} object is fired when the utterance has finished being spoken.
Syntax
Use the event name in methods like {{domxref("EventTarget.addEventListener", "addEventListener()")}} , or set an event handler property.
addEventListener("end", (event) => { })
onend = (event) => { }
Event type
A {{domxref("SpeechSynthesisEvent")}} . Inherits from {{domxref("Event")}} .
{{InheritanceDiagram("SpeechSynthesisEvent")}}
Event properties
In addition to the properties listed below, properties from the parent interface, {{domxref("Event")}} , are available.
{{domxref("SpeechSynthesisEvent.charIndex", "charIndex")}}{{ReadOnlyInline}}- : Returns the index position of the character in the
{{domxref("SpeechSynthesisUtterance.text")}}that was being spoken when the event was triggered.
- : Returns the index position of the character in the
{{domxref("SpeechSynthesisEvent.elapsedTime", "elapsedTime")}}{{ReadOnlyInline}}- : Returns the elapsed time in seconds after the
{{domxref("SpeechSynthesisUtterance.text")}}started being spoken that the event was triggered at.
- : Returns the elapsed time in seconds after the
{{domxref("SpeechSynthesisEvent.name", "name")}}{{ReadOnlyInline}}- : Returns the name associated with certain types of events occurring as the
{{domxref("SpeechSynthesisUtterance.text")}}is being spoken: the name of the SSML marker reached in the case of a{{domxref("SpeechSynthesisUtterance.mark_event", "mark")}}event, or the type of boundary reached in the case of a{{domxref("SpeechSynthesisUtterance.boundary_event", "boundary")}}event.
- : Returns the name associated with certain types of events occurring as the
{{domxref("SpeechSynthesisEvent.utterance", "utterance")}}{{ReadOnlyInline}}- : Returns the
{{domxref("SpeechSynthesisUtterance")}}instance that the event was triggered on.
- : Returns the
Examples
You can use the end event in an addEventListener method:
utterThis.addEventListener("end", (event) => {
console.log(
`Utterance has finished being spoken after ${event.elapsedTime} seconds.`,
);
});
Or use the onend event handler property:
utterThis.onend = (event) => {
console.log(
`Utterance has finished being spoken after ${event.elapsedTime} seconds.`,
);
};
Specifications
{{Specifications}}
Browser compatibility
{{Compat}}