Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Send click to google's chrome input html tag

Google chrome has a very nice speech recognition control in it's browser. For example if I place this html tag:

<input  id="speech" type="text" speech="speech" x-webkit-speech="x-webkit-speech" onspeechchange="processspeech();" onwebkitspeechchange="processspeech();" />  

with it's corresponding javascript:

<script type="text/javascript">

        function processspeech() {
            var speechtext = $("#speech").val();
            alert(speechtext);
        }

</script>

then I will be able to use google's speech recognition. I am wondering if it is possible to send a click to that input control in order to activate it with JavaScript. In other words I want to start recording the message by clicking my button other than the little microphone. I plan to use the website locally so maybe I can send a click some other way.

like image 533
Tono Nam Avatar asked Nov 04 '22 07:11

Tono Nam


1 Answers

If it acts like a <file> button, you can try two things:

  • Simulate a click event on the microphone. If speech recognition needs a long click, it won't work.
  • Hide the microphone and put your icon behind it (with a lower z-index). When a user clicks your icon, he will actually click the microphone.

These are some tricks used generally to style <input type="file" />, that's for instance how plupload does it.

like image 87
ldiqual Avatar answered Nov 09 '22 16:11

ldiqual