zoukankan      html  css  js  c++  java
  • Chrome — 让<input>标签支持语音搜索 xwebkitspeech

    使用Chrome浏览器且细心的骚年应该都会发现一些大的网站已经有了语音搜索功能了,例如淘宝、360搜索等等。不过只有Chorme11以上才能够支持。      

    实现起来非常简单,为input添加名为 x-webkit-speech 的属性就行了。

    可以用Chrome浏览器点击话筒体验一下语音搜索。

     相关属性设置:

    设置语言种类:lang

    <input type="text" x-webkit-speech lang="zh-CN" />

    设置发声语音改变时触发:onwebkitspeechchange

    <input type="text" x-webkit-speech onwebkitspeechchange="foo()" />

    语音输入语法,”builtin:search”值使得语音输入的内容尽量靠近搜索内容,去除多余的字符,例如“的”、“啦”:x-webkit-grammar

    <input type="text" class="text"  x-webkit-speech x-webkit-grammar="bUIltin:search">

    需要注意的是,这个语音识别实际上是调用谷歌的api,语言识别率还不错,因为需要走google的服务器。所有有时候会遇到加载很慢的情况。就现阶段来说,这个功能暂时还只能说趣味性大于实用性。

    另外,就是当具有语音搜索的页面是iframe页面时,点击麦克风后,“请开始说话”这浮动层就不跟随input输入框了。

  • 相关阅读:
    创建新用户
    发生tcp丢包(拥堵、超时)重传
    centos7装机和初步运维
    论上山和下山哪个费力
    一、Linux简介
    服务器设置FTP
    自定义部署资源服务器
    代码管理工具 Git
    远程连接工具rdcman
    dubbo学习(八)dubbo项目搭建--消费者(服务消费者)
  • 原文地址:https://www.cnblogs.com/bruceleeliya/p/2742577.html
Copyright © 2011-2022 走看看