Question

如何实现HTML5语音识别功能

Answer 1

HTML5之语音识别实例
代码
<input type="text" x-webkit-speech id="d1" lang="zh-CN" x-webkit-grammar="bUIltin:search" onwebkitspeechchange="foo()"/>

<script>
function foo(){
var n = document.getElementById("d1").value;
if(n == "百度"){
window.location.href = "http://www.baidu.com";
}else{
window.location.href = "http://www.ahsdxy.ah.edu.cn/";
}
}
</script>

说明：
1）x-webkit-speech：语音识别支持属性
<input type="text" x-webkit-speech/>
2）lang：设置语言种类，比如汉语:lang="ch-CN"
<input type="text" x-webkit-speech lang="ch-CN"/>
3） x-webkit-grammar ：语音输入语法
比如: x-webkit-grammar="bUIltin:search"使得语音输入的内容尽量靠近搜索内容，去除多余的字符，例如“的、啦”等
<input type="text" x-webkit-speech lang="ch-CN" x-webkit-grammar="bUIltin:search"/>
4） onwebkitspeechchange ：语音输入事件，当语音改变时触发
比如：onwebkitspeechchange="foo()" ，当停止语音时，会触发js中的foo()函数
<input type="text" x-webkit-speech lang="ch-CN" x-webkit-grammar="bUIltin:search"
onwebkitspeechchange="foo()"/>
此时，需要写相应的JavaScript函数foo()
<script>
function foo(){
//函数体，如下：
alert(8);
}
</script>