Input con comandos de voz en HTML5

Desde la versión de Google Chrome 11 se implementó un servicio de análisis de voz. Con esto es posible hablarle a un campo de texto y este mismo escribirá lo que nosotros decimos. Todo esto gracias a HTML5.

Si no me explico bien abre el siguiente demo con Google Chrome y haz clic en el ícono del micrófono para activar este servicio.

¿Impresionado? Yo también. Para agregar este campo simplemente tendremos que agregar el siguiente valor a nuestro input: x-webkit-speech.

Código :

<input type="text" x-webkit-speech />

Para detectar cuando alguien dejó de hablar lo hacemos con onwebkitspeechchange, como muestra el ejemplo.

Código :

<input id="hablame" type="text" x-webkit-speech speech error onwebkitspeechchange="funcionGenial();"/>

Si quieremos obtener la variable, el método más simple es con jQuery, de la siguiente manera.

Código :

var variable = $("#hablame").val();

Para detectar incapacidad de navegador de ejecutar esta utilidad, lo podemos hacer con la siguiente línea.

Código :

if (document.createElement("input").webkitSpeech === undefined) {
   document.write("<p>Lo siento, tu navegador no soporta esta función.</p>");
}

Aún está desarrollándose, existen errores al momento de detectar lo que dices pero para eso nos dieron mandíbulas, para vocalizar.

Cualquier duda, comentario o sugerencia, sígueme en twitter (@kinduff), o bien, dejame un comentario aquí.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.