Google搜索的语音输入功能:
1. 检测浏览器是否支持
if (document.createElement("input").webkitSpeech === undefined) {
alert("Speech input is not supported in your browser.");
}
2. 下面说下怎么实现,其实很简单。
<input type="text" x-webkit-speech />
就一句(so high),
3. 当然还有别的属性可以添加:
lang
设置语言种类:
<input type="text" x-webkit-speech lang="zh-CN" />
onwebkitspeechchange
语音输入事件,当发声语音改变时触发:
<input type="text" x-webkit-speech onwebkitspeechchange="foo()" />
function foo(){
alert('changed');
}x-webkit-grammar
语音输入语法,” builtin:search”值使得语音输入的内容尽量靠近搜索内容,去除多余的字符,例如汉字“的”
<input type="text" x-webkit-speech x-webkit-grammar="builtin:search" />
PS : 如果原input中value不为空,输入会直接添加在原有文字后面。既然用webkit就要用placeholder了,不要再使用value为作输入提示了。
W3C: http://lists.w3.org/Archives/Public/public-xg-htmlspeech/2011Feb/att-0020/api-draft.html