使用Chrome瀏覽器的同學(xué)應(yīng)該會經(jīng)?？吹揭恍┚W(wǎng)站的搜索框右邊有一個麥克風(fēng)的標志，點擊圖標后即可連接麥克風(fēng)進行語音識別搜索，那么這是如何實現(xiàn)的呢？

淘寶網(wǎng)上的語音搜索功能

其實非常簡單，這是html5下一個新的屬性，通過調(diào)用google的語音服務(wù)api，用于支持網(wǎng)頁內(nèi)的語音識別輸入功能。

只需要在輸入框的input上添加一個x-webkit-speech 屬性就可以了。

如本博客的搜索框：

<input type="text"  name="edtSearch" x-webkit-speech id="edtSearch" value="Search...." onfocus="if (this.value == 'Search....') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search....';}" />

另外它還可以添加以下屬性：

語言種類： lang="zh-CN"

發(fā)聲改變時觸發(fā)相關(guān)語音識別：onwebkitspeechchange="foo()"

讓語音輸入的內(nèi)容更加精確盡量接近搜索內(nèi)容：x-webkit-grammar="bUIltin:search"

通過平時的使用感覺如果發(fā)音清晰的話，識別率還算不錯。這是google應(yīng)用于Chrome瀏覽器上的一項實驗性功能，以上屬性同樣也對webkit內(nèi)核瀏覽器生效。

相關(guān)W3C標準參考文檔：http://lists.w3.org/Archives/Public/public-xg-htmlspeech/2011Feb/att-0020/api-draft.html