关于HTML5 语音搜索的问题
以前语音输入功能虽然没用过,但是看上去很高级的样子,有了智能手机之后,在ios和android中的语音输入,特别是iPhone的Siri,让一切变得如此简单,嘎嘎。
当然我不是在这里要实现如此强悍的功能,只是说说html5中的语音输入功能speech属性,大家先可以看看W3C文档:http://www.w3.org/2005/Incubator/htmlspeech/2010/10/google-api-draft.html
看上去很强大的样子,不过不要高兴的太早,因为大部分的浏览器还没有实现这些接口,目前可以用的只有chrome(11版本以上)的私有属性:x-webkit-speech。例如我们看看淘宝在chrome下的搜索框,如图:
实现语音输入也非常简单:
<input id=
"q"
name=
"q"
x-webkit-speech
/>
简单的来说,我们只要在input元素上加上x-webkit-speech属性就可以了,当然你如果用xhtml,那么标准的写法是:x-webkit-speech=”x-webkit-speech”;
<input id=
"q"
name=
"q"
x-webkit-speech=”x-webkit-speech”
/>
其他属性:
lang
设置语言种类:
lang=
"zh-CN"
x-webkit-grammar
语音识别语法,取值:
- translations—说一个词,并把它翻译
- definitions—说一个词,并且获得定音
- directions—说一个地址,要求行车路线
- dictation
事件
onwebkitspeechchange
语音输入事件,当发声语音改变时触发:
关于HTML5 语音搜索的问题的更多相关文章
- html5 语音搜索
开始以为是接口什么的,原来这就是语言搜索. 只需要在input加上x-webkit-speech <input type="text" class="text&qu ...
- 淘宝语音搜索的实现——html5
作为一个专业的淘宝控,不知道从什么时候开始发现淘宝上居然还有语音搜索,好吧,因为好奇心作祟还是想一探究竟.不过我想仔细一点的人,都会发现在只有在webkit内核的浏览器上有,原因是它只支持webkit ...
- HTML5语音输入方法
谷歌的网站是时逛时新啊,今天在他们首页发现了HTML5的新玩法——语音搜索.可惜的是只有webkit核心的浏览器才能使用.用法很简单只需要在input添加属性 x-webkit-speech 即可,例 ...
- 将语音搜索集成到Google Now中
原文标题:Use Voice Search to integrate with Google Now 原文链接:http://antonioleiva.com/voice_search_google_ ...
- Android语音搜索
前言 在现有的软件的搜索框中基本上都会加上语音搜索的图标,以方便用户输入.我们xxxx的搜索框其实也可以借鉴这样的输入方式,提高用户体验.语音识别有3种方式实现①使用intent调用语音识别程序;②通 ...
- 【转】.net 实现 语音搜索(仅限WebKit内核浏览器)
<input type="text" class="text" name="value_2" id="value_2&quo ...
- x-webkit-speech语音搜索
如果你没看到语音图标说明你的浏览器不支持x-webkit-speech 换个chrome你会发现输入框的右侧出现语音小图标.
- HTML5——语音输入
一.使用方式: <input type="text" x-webkit-speech /> 二.属性 1.lang属性:语言种类 <input type=&quo ...
- 【转】HTML5的语音输入 渐进使用HTML5语言识别, so easy!
转自: 本文地址:http://www.zhangxinxu.com/wordpress/?p=2408 一.本不想写此文 HTML5语音识别(现在一般用在搜索上),目前相关介绍还是挺多的.为何呢?因 ...
随机推荐
- 05_Elasticsearch 单模式下API的增删改查操作
05_Elasticsearch 单模式下API的增删改查操作 安装marvel 插件: zjtest7-redis:/usr/local/elasticsearch-2.3.4# bin/plugi ...
- 【转】Android用NDK和整套源码下编译JNI的不同
原文网址:http://www.devdiv.com/android_ndk_jni_-blog-99-2101.html 前些天要写个jni程序,因为才几行代码,想着用ndk开发可能容易些,就先研究 ...
- 通过expdp/impdp进行oracle数据库的备份恢复详细指导
假定导出oracle数据库home目录为/opt/oracle,数据库用户为exp_user/test,导入用户为imp_user/test,给出如下样例,具体使用时根据实际情况修改路径及用户名/密码 ...
- POJ Oulipo (KMP)
题目大意 : 在一个字符串中找出目标单词的个数 代码: #include<iostream> #include<cstdio> #include<cstdlib> ...
- windows多线程同步总结
1.多线程同步与多线程互斥的关系 其实这也是我一直困扰的问题,在这里我只是说说我的理解.我的理解是多线程互斥是针对于多线程资源而言的. 而多线程同步是针对于多线程时序问题.由于线程的并发性导致其运行时 ...
- sudo nopasswd
preface,不问头条,但汝读荐,诚意满满的!
- 《Java程序员面试笔试宝典》之为什么Java中有些接口没有任何方法
由于Java不支持多重继承,即一个类只能有一个父类,为了克服单继承的缺点,Java语言引入了接口这一概念.接口是抽象方法定义的集合(接口中也可以定义一些常量值),是一种特殊的抽象类.接口中只包含方法的 ...
- Linux各种包安装及命令
1.Locate yum -y install mlocate 若出现问题: locate: can not stat () `/var/lib/mlocate/mlocate.db': 没有那个文件 ...
- Android 打造自己的个性化应用(一):应用程序换肤主流方式的分析与概述
Android平台api没有特意为换肤提供一套简便的机制,这可能是外国的软件更注重功能和易用,不流行换肤.系统不提供直接支持,只能自行研究. 换肤,可以认为是动态替换资源(文字.颜色.字体大小.图片. ...
- Android学习笔记—Windows下NDK开发简单示例
该示例假设Android开发环境已经搭建完成,NDK也配置成功: 1.在Eclipse上新建Android工程,名称为ndkdemo.修改res\layout\activity_main.xml &l ...