Text to Voice in JavaScript example

Jun 13, 2021 JavaScript

After reading SpeechSynthesisUtterance I wanted to try it on my own on a minimal example, cause their own example Speech synthesiser isn't working on my Chromium.

Speech synthesiser

The mentioned example from above has a input for the rate, pitch and for the voice. I guess the voice select seems to be the problem in my Chromium, cause synth.getVoices() is returning nothing. I will let rate, pitch and voice on the default the value in my example. Just type some text and click the Speak button.

JavaScript code behind it

Here the simple HTML and JavScript code behind this small example.

<textarea id="text">25 degree</textarea>
<button onclick="speak();">Speak</button>
<script>
var synth = window.speechSynthesis;

function speak() {
  var text = document.getElementById('text').value;
  var utterThis = new SpeechSynthesisUtterance(text);
  synth.speak(utterThis);
}
</script>