The new gameplay of html5 - voice search_html5 tutorial skills

Google's website is always new, and today I discovered a new way to play HTML5 on their homepage - voice search. Unfortunately, it can only be used by webkit-based browsers. Usage is very simple
Just add the attribute x-webkit-speech to the input. The example is as follows:

Copy code

The code is as follows:

This way you will have an extra input box on the right "Small Microphone", when you click it, it will prompt

and then it will be recognized. I tested it and found that the recognition rate of Chinese and English is quite high.
Other attributes of voice input:
lang can force the language type of the voice in the input box, such as

Onwebkitspeechchange is currently the only known voice event. As the name suggests, it is an event triggered when the voice changes. Generally, it can be submitted as

Copy code

The code is as follows:

After saying this, it will automatically search
x-webkit-grammar is not an attribute for voice search, but it can control this input Syntax, for example, when making a search box, you can use

Copy the code

The code is as follows:

Make the voice input content as close as possible to the search content and remove redundancy characters, such as ""
This function is quite interesting, but I cannot praise its practicality. The main reason is that the scope of application is too small, so I can only hope that HTML5 will be unified and applied as soon as possible.
Related references:
HTML5 voice search (Taobao store voice search)
HTML5 voice search only requires one code