[Reprint] HTML5 voice input (Taobao Voice Search) Method

Source: Internet
Author: User

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, only onwebkitspeechchange , as the name suggests, is the event triggered when the voice changes. Generally, it can be used as a submission
    input type =" text "X-WebKit-speech onwebkitspeechchange =" $ (this ). cloest ('form '). submit () "/
    after that, the system automatically searches

  • 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.

 

ArticleReprinted from: http://liumiao.me/html/wd/W3C/264.html

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.