Run ResponsiveVoice speech on page load

James Shelton picture James Shelton · Nov 24, 2015 · Viewed 7.9k times · Source

This works properly, it speaks the text area on click, but how can I change it to speak onload?

<script src="http://responsivevoice.org/responsivevoice/responsivevoice.js"></script>
<script src="http://code.jquery.com/jquery-git2.js"></script>

<textarea id="text" cols="45" rows="3"> HHHH</textarea>

<select id="voiceselection"></select>

<input onclick="responsiveVoice.speak($('#text').val(),$('#voiceselection').val());" type="button" value="Play" />
<br>
<button id="isPlaying">Playing:</button>
<p id="r">?</p>

Text area just says four letters now.

I imagine this is the key part, but can not fit it into anything properly to execute:

responsiveVoice.speak($('#text').val(),$('US English Female').val());

I tried:

But I get a "No voice found for: undefined" error.

Answer

Paul Roub picture Paul Roub · Nov 24, 2015

Hook into the OnVoiceReady handler, then try to speak once the default voice, etc. is loaded:

responsiveVoice.OnVoiceReady = function() {
  console.log("speech time?");
  responsiveVoice.speak($('#text').val());
};
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//responsivevoice.org/responsivevoice/responsivevoice.js"></script>

<textarea id="text" cols="45" rows="3">one two three</textarea>