Home > Web Front-end > H5 Tutorial > How to implement voice search box with html5_html5 tutorial skills

How to implement voice search box with html5_html5 tutorial skills

WBOY
Release: 2016-05-16 15:48:10
Original
2008 people have browsed it

Let’s take a look at their different displays first.
The following is a screenshot under Firefox:

The following is a screenshot in chrome:

What you can guess is that the code written is definitely incompatible. But you will find that it is relatively simple. Even if you are a front-end beginner, you will understand

Copy the code
The code is as follows :

The meaning of the parameters:
x-webkit-speech: It makes a small microphone appear on the right side of your input box, with a voice function.
lang: It is the language type of the voice in the mandatory input box. For example, the lang="zh-CN" written above refers to Simplified Chinese.
x-webkit-grammar: refers to the voice input grammar. The "builtin:search" value makes the voice input content as close as possible to the search content and removes redundant characters.

Note: However, the compatibility of this hardware still needs to be improved, because when you mix Chinese and English voices, there will probably be a lot of problems.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template