Direct voice / speech on a mobile browser

I would like to create a web application that will need to be processed with many short user inputs, but instead of entering all the texts, the user should be able to use a microphone.

I know that iPhone and Android smartphones have a “microphone button” on the keyboard, but both platforms require you to focus the input first to start recording. It would be much better if I only had a button , because otherwise you really don't feel like you want to use the input using your voice.

I tried using the attribute x-webkit-speechon my Android phone, but either Dolphin HD or Google Chrome did display the actual speech input field.

Is there a way to open the speech input dialog directly without opening the first keyboard or am I just expecting a lot?

+5
source share
1 answer

(Assuming that voice input is really enabled in the browser), you can only display the “microphone button” and redirect the input to where you want, for example in a text box:

<script type="text/javascript">
function transcribe(words){
    document.getElementById("mic").value="";
    document.getElementById("speech").value=words;
    document.getElementById("speech").focus();
}
</script>
Speech input for textarea - click the microphone icon and talk: <br> 
<br>
<textarea id="speech" cols="50"></textarea>
<input id="mic" style="width:15px; height:20px; border:0px; background-color:transparent" x-webkit-speech onwebkitspeechchange="transcribe(this.value)">

Hope this help!

+1
source

All Articles