語音搜索功能最近很火，各大網站、社區都沒有放過這麼一個人性化功能。而淘寶網的語音搜索也有了一陣子了，但似乎都沒看到相關的博客或帖子在說這個如何實現，今天查了點資料，發現原來實現是如此簡單，可能是因為太簡單了，也就沒有人討論了吧。
HTML5-語音搜索框
<html>
<head>
<script>
function echoSpeakContent(){
var objVal = document.getElementById('speakInput').value;
alert(objVal);
}
</script>
<title>html5-speaking</title>
</head>
<body>
<input x-webkit-speech x-webkit-grammar="bUIltin:search" lang="zh-CN" onwebkitspeechchange="echoSpeakContent();" id="speakInput"/>
</body>
</html>
在Chrome中的效果如下