关于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语音识别(现在一般用在搜索上),目前相关介绍还是挺多的.为何呢?因 ...
随机推荐
- 提高效率的便签By番茄时间管理 win7标签,小功能,大作用
今日待办 把一些重要的事情,列入其中. 着重处理. 活动清单 罗列一些最近需要做的事情,不一定按照紧急重要的程度. 把活动清单中的事情,按照实际情况,安排到今日待办当中. 还有一个我喜欢的'头脑风暴' ...
- SQL查询最近三个月的数据(查询最近几天,几年等等)
定义和用法 :: 天,这样就可以找到付款日期. 我们使用如下 ,OrderDate) AS OrderPayDate FROM Orders 结果: OrderId OrderPayD ...
- JQuery 图片延迟加载并等比缩放插件
原文地址:http://www.shangxueba.com/jingyan/1909987.html DEMO地址:http://demo.jb51.net/html/jquery_img/jque ...
- Base64 加密之中文乱码
ase64编码将二进制数据按照每三个字节转换成四个字节可读字符,编码后的字符长度大约为136.1%.字符范围为 A-Z a-z 0-9 \ +.但编码后的字符串不太适合使用URL传输,中文加密 ...
- Spring框架下的单元测试方法
介绍在Spring的框架下,做单元测试的两种办法. 一.使用spring中对Junit框架的整合功能 除了junit4和spring的jar包,还需要spring-test.jar.引入如下依赖: & ...
- java.lang.IllegalArgumentException: Timestamp format must be yyyy-mm-dd hh:mm:ss[.fffffffff]
此方法为Timestamp的 转换方法. 这几天做到excel导入功能,其中里面有几个时间时段,所以用了这个类来将导入的字符串格式转换Timestamp格式. 不慎出现了 java.lang.Ille ...
- XShell连接CentOS 7.2显示中文乱码问题的解决方法
背景 使用U盘往Windows主机.Linux主机传文件还是经常的事,但有时候文件名有中文, 传到Linux机器会有乱码,选择起来也很麻烦,最近刚好遇到,写下解决方法. 环境 Linux [root@ ...
- 集成支付宝SDK遇到的坑
一.首先我先把集成过程说一下.小编想说的话:支付宝是我做支付中觉得坑最多的一个,各种编译不过,各种出问题. 废话不多说,进入主题:1.首先当前是下载官方SDK啦,当前你也可以通过cocopods进行导 ...
- 十分钟学会写shell脚本
大家好!我是handsomecui,下面我为大家讲解一下shell脚本的写法,讲的不好的地方,欢迎大家留言拍砖. 1.在linux下会写shell脚本是非常重要的,下面我参照例子给大家展示几个脚本,顺 ...
- mycat源码分析
http://www.cnblogs.com/fernandolee24/p/5196367.html