SpeechSynthesisUtterance

SpeechSynthesisUtterance.SpeechSynthesisUtterance() (en-US)

Возвращает новый экземпляр объекта SpeechSynthesisUtterance

SpeechSynthesisUtterance ещё наследует свойства из его своего родительского интерфейса EventTarget.

SpeechSynthesisUtterance.lang (en-US)

Получает и устанавливает язык высказывания.

SpeechSynthesisUtterance.pitch (en-US)

Получает и устанавливает высоту, на которой произносится высказывание

SpeechSynthesisUtterance.rate (en-US)

Получает и устанавливает скорость, с которой будет произноситься высказывание.

SpeechSynthesisUtterance.text (en-US)

Получает и устанавливает текст, который будет синтезироваться при произнесении высказывания.

SpeechSynthesisUtterance.voice (en-US)

Получает и устанавливает голос, который будет использоваться для произнесения речи.

SpeechSynthesisUtterance.volume (en-US)

Получает и устанавливает громкость, на котором будет произноситься высказывание.

SpeechSynthesisUtterance.onboundary (en-US)

Срабатывает, когда произнесённое высказывание достигает границы слова или предложения.

SpeechSynthesisUtterance.onend (en-US)

Срабатывает, когда произнесение произнесено.

SpeechSynthesisUtterance.onerror (en-US)

Срабатывает, когда возникает ошибка, которая препятствует успешному произнесению высказывания.

SpeechSynthesisUtterance.onmark (en-US)

Срабатывает, когда произнесённое высказывание достигает названного тега метки «SSML».

SpeechSynthesisUtterance.onpause (en-US)

Срабатывает, когда высказывание приостановлено.

SpeechSynthesisUtterance.onresume (en-US)

Срабатывает, когда приостановленное высказывание возобновляется.

SpeechSynthesisUtterance.onstart (en-US)

Срабатывает, когда произнесение произнесено.

В нашей базовой Демо-версия синтезатора речи, мы сначала получаем ссылку на контроллер SpeechSynthesis, используя window.speechSynthesis. После определения некоторых необходимых переменных мы получаем список доступных голосов, используя SpeechSynthesis.getVoices() (en-US), и заполнить меню выбора с ними, чтобы пользователь мог выбрать, какой голос он хочет.

Внутри обработчика inputForm.onsubmit мы останавливаем отправку формы с помощью preventDefault(), используйте constructor (en-US) для создания нового экземпляра высказывания, содержащего текст из текста <input>, установите voice (en-US)на голос, выбранный в элементе <select> и начните высказывание через SpeechSynthesis.speak() (en-US) метод.

var synth = window.speechSynthesis;

var inputForm = document.querySelector("form");
var inputTxt = document.querySelector("input");
var voiceSelect = document.querySelector("select");

var voices = synth.getVoices();

for (i = 0; i < voices.length; i++) {
  var option = document.createElement("option");
  option.textContent = voices[i].name + " (" + voices[i].lang + ")";
  option.setAttribute("data-lang", voices[i].lang);
  option.setAttribute("data-name", voices[i].name);
  voiceSelect.appendChild(option);
}

inputForm.onsubmit = function (event) {
  event.preventDefault();

  var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
  var selectedOption = voiceSelect.selectedOptions[0].getAttribute("data-name");
  for (i = 0; i < voices.length; i++) {
    if (voices[i].name === selectedOption) {
      utterThis.voice = voices[i];
    }
  }
  synth.speak(utterThis);
  inputTxt.blur();
};

• Web Speech API