RTCDTMFSender: tonechange event

BaselineWidely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2020.

Thetonechange event is sent to anRTCDTMFSender by theWebRTC API to indicate whenDTMF tones previously queued for sending (by callingRTCDTMFSender.insertDTMF()) begin and end.

To determine what tone started playing, or if a tone stopped playing, check the value of the event'stone property.

This event is not cancelable and does not bubble.

Syntax

Use the event name in methods likeaddEventListener(), or set an event handler property.

addEventListener("tonechange", (event) => { })ontonechange = (event) => { }

Event type

AnRTCDTMFToneChangeEvent. Inherits fromEvent.

Event properties

In addition to the properties ofEvent, this interface offers the following:

RTCDTMFToneChangeEvent.toneRead only: A string specifying the tone which has begun playing, or an empty string ("") if the previous tone has finished playing.

Examples

This example establishes a handler for thetonechange event which updates an element to display the currently playing tone in its content, or, if all tones have played, the string "<none>".

This can be done usingaddEventListener():

dtmfSender.addEventListener(  "tonechange",  (ev) => {    let tone = ev.tone;    if (tone === "") {      tone = "&lt;none&gt;";    }    document.getElementById("playingTone").innerText = tone;  },  false,);

You can also just set theontonechange event handler property directly:

dtmfSender.ontonechange = (ev) => {  let tone = ev.tone;  if (tone === "") {    tone = "&lt;none&gt;";  }  document.getElementById("playingTone").innerText = tone;};