HTML5语音输入方法
谷歌的网站是时逛时新啊,今天在他们首页发现了HTML5的新玩法——语音搜索。可惜的是只有webkit核心的浏览器才能使用。用法很简单
只需要在input添加属性 x-webkit-speech 即可,例子如下:
<input type="text" x-webkit-speech />
这样你的输入框右边里就多了个「小话筒」,点击的时候就会提示
这时说出来识别后就可以了,我测试下来,中文英语的识别率还挺高的。
语音输入其他属性:
lang:
这玩意可以强制输入框里面的语音的语言种类,例如
<input type="text" x-webkit-speech lang="zh-CN"/>
语音事件:
目前已知的只有onwebkitspeechchange,顾名思义,就是语音发生变化时触发的事件,一般可以作为提交
<input type="text" x-webkit-speech onwebkitspeechchange="$(this).cloest('form').submit()"/>
这样说完以后就自动搜索了
x-webkit-grammar:
这个不是语音搜索用的属性,但是可以控制这个输入的语法,例如在做搜索框的话就可以用
<input type="text" x-webkit-speech x-webkit-grammar="bUIltin:search" />
使得语音输入的内容尽量靠近搜索内容,去除多余的字符,例如「的」
这个功能相当有趣,实用就不敢恭维了,主要是因为适用范围太小啊,所以只能希望HTML5尽快统一并应用了。
HTML5语音输入方法的更多相关文章
- HTML5——语音输入
一.使用方式: <input type="text" x-webkit-speech /> 二.属性 1.lang属性:语言种类 <input type=&quo ...
- 【转】HTML5的语音输入 渐进使用HTML5语言识别, so easy!
转自: 本文地址:http://www.zhangxinxu.com/wordpress/?p=2408 一.本不想写此文 HTML5语音识别(现在一般用在搜索上),目前相关介绍还是挺多的.为何呢?因 ...
- HTML5微信jssdk录音播放语音的方法
HTML5微信jssdk录音播放语音的方法需要注意的2个问题1 就是一定要判断1秒内 录音都不算 ps:太短不能录音 2 录音超过1分钟 会发现正在录音突然消失 所以要写wx.onVoiceRecor ...
- HTML5中x-webkit-speech语音输入功能
如今各大站点都在搜索框中增加了语音输入功能,只是眼下仅仅有Chrome 11及以上版本号才支持. 能够用chrome浏览器在这里试试效果,点击话筒就可以: 实现起来也很easy,为input加入名为 ...
- ios语音输入崩溃
游戏中任何可以输入的地方,只要调用语音输入,必然会导致app崩溃,解决方法如下: ok, so essentially the gist of it is that siri wants gl con ...
- HoloLens开发手记 - Unity之语音输入
对于HoloLens,语音输入是三大基本输入方式之一,广泛地运用在各种交互中.HoloLens上语音输入有三种形式,分别是: 语音命令 Voice Command 听写 Diction 语法识别 Gr ...
- 关于HTML5 语音搜索的问题
以前语音输入功能虽然没用过,但是看上去很高级的样子,有了智能手机之后,在ios和android中的语音输入,特别是iPhone的Siri,让一切变得如此简单,嘎嘎. 当然我不是在这里要实现如此强悍的功 ...
- android上使用蓝牙设备进行语音输入
主要实现步骤如下:1.确保已经和蓝牙耳机配对连接上.2.开启蓝牙信道AudioManager mAudioManager = (AudioManager)getSystemService(Contex ...
- MUI - 为textarea添加语音输入和清除的功能
为textarea添加语音输入和清除的功能 mui支持input输入框语音输入和清除的功能,只需要添加相关css类即可. http://www.cnblogs.com/phillyx/ 代码如下 &l ...
随机推荐
- eMMC基础技术1:MMC简介
[转]http://www.wowotech.net/basic_tech/mmc_sd_sdio_intro.html 1. 前言 熟悉Linux kernel的人都知道,kernel使用MMC s ...
- matlab处理手写识别问题
初学神经网络算法--梯度下降.反向传播.优化(交叉熵代价函数.L2规范化) 柔性最大值(softmax)还未领会其要义,之后再说 有点懒,暂时不想把算法重新总结,先贴一个之前做过的反向传播的总结ppt ...
- JQuery 拾遗
jquery基本上依赖百度,不熟悉的jquery操作记录于此: 1.判断元素的显示隐藏:$("#XXX").is(':visible'). 2. jquery取所有属性以什么开头 ...
- 获取本地计算机名和IP地址
WSADATA wsadata; != WSAStartup(MAKEWORD(, ), &wsadata)) { AfxMessageBox("初始化网络环境失败!"); ...
- linux中模糊查找文件
1.在当前目录下搜索指定文件: find . -name test.txt 2.在当前目录下模糊搜索文件: find . -name '*.txt' 3.在当前目录下搜索特定属性的文件: find . ...
- 题解-bzoj4320 Homework
Problem bzoj4320 Solution 前置技能:分块+线段树+卡常+一点小小的数学知识 考试时A的 这种题无论怎么处理总有瓶颈,套路分块,设\(k\)以下的插入时直接暴力预处理,查询时直 ...
- CSS基础入门
css基础语法 一.CSS格式 选择器{ 属性名:属性值; 属性名:属性值; } 选择器负责圈定范围,要修改的元素集合,花括号内的声明由属性名和属性值组成(key:value)的形式,用于设定具体样式 ...
- kafka集群报错
bin/kafka-server-start.sh config/server.properties ,问题来了 : [root@localhost kafka_2.12-0.10.2.0]# Exc ...
- 大数据mapreduce二分法ip定位之Python实现
ip定位数据大约12M,采用-chacheFile 分发 文件来源https://pan.baidu.com/s/1J0pwTafHgt4T0k3vV_gC-A 格式大致格式如下: 0.0.0.0 0 ...
- 2018谷歌I/O开发者大会8大看点汇总 新品有哪些
2018谷歌I/O开发者大会8大看点汇总 新品有哪些美国科技媒体The Verge近日撰文,列举了在即将召开的2018年谷歌I/O开发者大会上的8大看点,包括Android P.人工智能等等. 以下为 ...