Turn: HTML5 voice input (Taobao Voice Search) Method

Google's website is a new place to visit. Today, they found a new HTML5 method-Voice Search on their homepage. Unfortunately, only webkit core browsers can be used. Easy to use
You only need to add attributes in input.X-webkit-speechAn example is as follows:

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

In this way, a "Microphone" is added to the right of your input box. When you click it, a prompt is displayed.

Now we can recognize it. After testing, the recognition rate in Chinese and English is quite high.

Other Properties of voice input:

• Lang

  This can force the language type of the voice in the input box, for example
  <Input type = "text" x-webkit-speech lang = "zh-CN "/>

• Voice events

  Currently, onlyOnwebkitspeechchangeAs the name suggests, it is the event triggered when the voice changes. Generally, it can be submitted.
  <Input type = "text" x-webkit-speech onwebkitspeechchange = "$ (this). cloest ('form'). submit ()"/>
  In this way, the system will automatically search.

• X-webkit-grammar

  This is not an attribute used for voice search, but can control the input syntax. For example, you can use it in the search box.
  <Input type = "text" x-webkit-speech x-webkit-grammar = "bUIltin: search "/>

  Make the voice input content as close as possible to the search content to remove unnecessary characters, such as "」

This function is quite interesting, so I dare not compliment it. It is mainly because the application scope is too small, so I can only hope that HTML5 will be integrated and applied as soon as possible.

From: http://liumiao.me/html/wd/W3C/264.html