今天图老师小编给大家展示的是HTML5 语音搜索(淘宝店语音搜素),精心挑选的内容希望大家多多支持、多多分享,喜欢就赶紧get哦!
【 tulaoshi.com - Web开发 】
Html5支持语音搜索,可惜的是只有webkit核心的浏览器才能使用。用法很简单 只需要在input添加属性x-webkit-speech即可,例子如下: input type="text" x-webkit-speech /这样你的输入框右边里就多了个「小话筒」,点击的时候就会提示
(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)这时说出来识别后就可以了,如淘宝店语音搜素:
(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)
语音输入其他属性: lang 就是语言种类
可以控制输入框里面的语音的语言种类,例如 input type="text" x-webkit-speech lang="zh-CN"/
目前已知的只有onwebkitspeechchange,顾名思义,就是语音发生变化时触发的事件,一般可以作为提交 input type="text" x-webkit-speech onwebkitspeechchange="$(this).cloest('form').submit()"/ 这样说完以后就自动搜索了。使得语音输入的内容尽量靠近搜索内容,去除多余的字符,例如「的」。
下面做一个小例子测试一下:效果如下:
来源:http://www.tulaoshi.com/n/20160219/1600418.html
看过《HTML5 语音搜索(淘宝店语音搜素)》的人还看了以下文章 更多>>
如果您有什么好的建议或者疑问,可以联系我们。 商务合作QQ:3272218541;3282258740。商务合作微信:13319608704;13319603564。
加好友请备注机构名称。让我们一起学习、一起进步tulaoshi.com 版权所有 © 2019 All Rights Reserved. 湘ICP备19009391号-3
微信公众号