Using Google Text-To-Speech in Javascript

I need to play Google text-to-speech in JavaScript.
The idea is to use the web service:

http://translate.google.com/translate_tts?tl=en&q=This%20is%20just%20a%20test

And play it on a certian action, e.g. a button click.

But it seems that it is not like loading a normal wav/mp3 file:

<audio id="audiotag1" src="audio/example.wav" preload="auto"></audio>

<script type="text/javascript">
    function play() {
        document.getElementById('audiotag1').play();
    }
</script>

How can I do this?

Solution 1:

Another option now may be HTML5 text to speech, which is in Chrome 33+ and many others.

Here is a sample:

var msg = new SpeechSynthesisUtterance('Hello World');
window.speechSynthesis.speak(msg);

With this, perhaps you do not need to use a web service at all.

Solution 2:

Here is the code snippet I found:

var audio = new Audio();
audio.src ='http://translate.google.com/translate_tts?ie=utf-8&tl=en&q=Hello%20World.';
audio.play();

Solution 3:

You can use the SpeechSynthesisUtterance with a function like say:

function say(m) {
  var msg = new SpeechSynthesisUtterance();
  var voices = window.speechSynthesis.getVoices();
  msg.voice = voices[10];
  msg.voiceURI = "native";
  msg.volume = 1;
  msg.rate = 1;
  msg.pitch = 0.8;
  msg.text = m;
  msg.lang = 'en-US';
  speechSynthesis.speak(msg);
}

Then you only need to call say(msg) when using it.

Update: Look at Google's Developer Blog that is about Voice Driven Web Apps Introduction to the Web Speech API.