skip to Main Content

I want to create a site that will pronounce Telugu letters. Even though the code is not showing any error it is not pronouncing the given letters.

I tried the following code but it didn’t work

// Check if the browser supports the Web Speech API
if ('speechSynthesis' in window) {
  const wordInput = document.getElementById('wordInput');
  const pronounceButton = document.getElementById('pronounceButton');

  // Create a function to pronounce the entered Telugu word
  function pronounceWord() {
    const teluguWord = wordInput.value.trim();

    if (teluguWord !== '') {
      let speech = new SpeechSynthesisUtterance();
      speech.lang = 'hi-IN'; // Set the language to Telugu (te-IN)
      speech.text = teluguWord;
      window.speechSynthesis.speak(speech);
    } else {
      alert('Please enter a Telugu word.');
    }
  }

  // Add an event listener to the button
  pronounceButton.addEventListener('click', pronounceWord);
} else {
  alert("Speech synthesis not supported in this browser.");
}
<h1>Pronounce Telugu Words</h1>
<input type="text" id="wordInput" placeholder="Enter a Telugu word">
<button id="pronounceButton">Pronounce</button>

2

Answers


  1. Your code is fine, I checked and run the file, although when it will be pronounced it will sound like English but the code is working. Maybe browser issue or your speaker is off.

    Login or Signup to reply.
  2. An answer to HTML5 Speech Synthesis API voice/languages support

    shows that Telugu (te-IN) is not supported by the Web Speech API

    However hi-IN and en-IN are – if I change your code to use hi-IN and enter हिन्दी or नमस्ते, it pronounces it in Hindi.

    Here is a test with all available languages, it is using the recommended loading method too.

    const synth = window.speechSynthesis;
    
    const inputForm = document.querySelector("form");
    const inputTxt = document.querySelector("input");
    const voiceSelect = document.querySelector("select");
    
    let voices;
    
    const loadVoices = () => {
      voices = synth.getVoices();
      voices.sort((a, b) => a.lang.localeCompare(b.lang) || a.name.localeCompare(b.name));
      voiceSelect.innerHTML += voices.map((voice, i) => `<option value="${i}">${voice.lang}: ${voice.name}</option>`);
    };
    
    // in Google Chrome the voices are not ready on page load
    if ("onvoiceschanged" in synth) {
      synth.onvoiceschanged = loadVoices;
    } else {
      loadVoices();
    }
    
    inputForm.addEventListener("submit", (event) => {
      event.preventDefault();
      const utterThis = new SpeechSynthesisUtterance(inputTxt.value);
      utterThis.voice = voices[voiceSelect.value];
      synth.speak(utterThis);
      inputTxt.blur();
    });
    <h1>Pronounce Words</h1>
    <form>
      <select id="lang">
        <option value="0">Please select</option>
      </select>
      <input type="text" id="wordInput" placeholder="Enter one or more words">
      <button type="submit">Pronounce</button>
    </form>
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search