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>

HTML5之语音识别实例的更多相关文章

  1. 免费的HTML5连载来了《HTML5网页开发实例详解》连载(二)

    最近新浪.百度.腾讯.京东.大众点评.淘宝等流行的网站都加大了招聘HTML5的力度,HTML5开发人员成了抢手货,本次连载的是由大众点评前端工程师和一淘网前端工程师基情奉献的<HTML5网页开发 ...

  2. 《HTML5与CSS3实例教程》

    <HTML5与CSS3实例教程> 基本信息 作者: (美)Brian P. Hogan 译者: 卢俊祥 丛书名: 图灵程序设计丛书 出版社:人民邮电出版社 ISBN:97871153634 ...

  3. 免费的HTML5连载来了《HTML5网页开发实例详解》连载(六)媒体查询

    响应式设计的另一个重要技术手段是媒体查询.如果只是简单的设计一个流式布局系统,那么可以保证每个网格按比例的放大和缩小,但有可能会使得在小屏幕下(如手机设备)网格太小而严重影响阅读,这样的设计称不上响应 ...

  4. 免费的HTML5连载来了《HTML5网页开发实例详解》连载(五)图解通过Fiddler加速开发

    Fiddler是Windows底下最强大的请求代理调试工具,监控任何浏览器的HTTP/HTTPS流量,窜改客户端请求和服务器响应,解密HTTPS Web会话,图4.44为Fiddler原理示意图. 图 ...

  5. 《HTML5网页开发实例详解》连载(四)HTML5中的FileSystem接口

    HTML 5除了提供用于获取文件信息的File对象外,还添加了FileSystem相关的应用接口.FileSystem对于不同的处理功能做了细致的分类,如用于文件读取和处理的FileReader和Fi ...

  6. 免费的HTML5连载来了《HTML5网页开发实例详解》连载(三)DOCTYPE和字符集

    在2.1.2节中通过新老DOCTYPE的对比,读者可以清晰地看到HTML 5在精简旧有结构上做出的努力.DOCTYPE在出现之初主要用于XML中,用作描述XML允许使用的元素.属性和排列方式.起初HT ...

  7. 当里个当,免费的HTML5连载来了《HTML5网页开发实例详解》连载(一)

    读懂<HTML5网页开发实例详解>这本书 你还在用Flash嘛?帮主早不用了 乔布斯生前在公开信“Flash之我见”中预言:像HTML 5这样在移动时代中创立的新标准,将会在移动设备上获得 ...

  8. 免费的HTML5连载来了《HTML5网页开发实例具体解释》连载(六)媒体查询

    响应式设计的还有一个重要技术手段是媒体查询.假设仅仅是简单的设计一个流式布局系统,那么能够保证每一个网格按比例的放大和缩小,但有可能会使得在小屏幕下(如手机设备)网格太小而严重影响阅读,这种设计称不上 ...

  9. 感谢各位亲们的大力支持,免费的HTML5学习课程《HTML5网页开发实例具体解释》连载已经结束了!

    感谢各位亲们的大力支持,免费的HTML5学习课程<HTML5网页开发实例具体解释>连载已经结束了.  有兴趣的读者能够看我的博客,也能够看以下的链接逐个学习: 当里个当.免费的HTML5连 ...

随机推荐

  1. 第八章:SCRT搭建ES搜索引擎步骤

    1.打开SecureCRT工具,输入服务器IP.端口号,确认后根据提示输入账号密码. 2.进入后判断服务器是否安装过JDK(1.6.0以上版本), 输入命令:#  java  –version 3.如 ...

  2. SQL Server datetime数据类型设计、优化误区

    一.场景 在SQL Server 2005中,有一个表TestDatetime,其中Dates这个字段的数据类型是datetime,如果你看到表的记录如下图所示,你最先想到的是什么呢? (图1:数据列 ...

  3. Asp.Net生成无限级菜单

    首先创建SQL脚本 ) DROP TABLE [Menu] CREATE TABLE [Menu] ( , ) NOT NULL, ) NULL, ), ) NULL, ), [AddTime] [d ...

  4. 【ACM】Crixalis's Equipment

      #include "stdio.h" #include "stdlib.h" /* 贪心算法: Ai->x 表示第i个物品的体积 Ai->y 表 ...

  5. svn: warning: xxxx is already under version control

    svn stat  查看当前目录下svn状态 svn remove xxxx svn add xxx svn ci -m "注释"

  6. 【转】C语言中结构体的位域(bit-fields)

    有些信息在存储时,并不需要占用一个完整的字节, 而只需占几个或一个二进制位.例如在存放一个开关量时,只有0和1 两种状态, 用一位二进位即可.为了节省存储空间,并使处理简便,C语言又提供了一种数据结构 ...

  7. MYSQL 问题

    MYSQL 问题 (1)mysql server has gone away 导数据时,如果脚本太大,会执行中断,这时需要修改最大允许包的大小: set global max_allowed_pack ...

  8. EventBus的粘性事件

    下午赶去公司解决了电台业务首次语音搜台后(用到服务,但只出一个独立的Activity,主界面并没有打开)不能听歌识曲的问题. 排查到最后,去识别的消息确实是发出去了,但是却没有收到,没有收到消息当然不 ...

  9. HKC显示器开机亮一下就不显示了

    一台HKC显示器开机显一下就黑了 最近加了一个显示器做扩展屏幕,可以不亮有问题啊     芯片坏了引起的~ 不是自己的,不能拆机啊啊   文章来源:刘俊涛的博客 欢迎关注,有问题一起学习欢迎留言.评论 ...

  10. [Objective-C A]-知识点锦集

    1.@autoreleasepool  why1 2.retain O-C内存管理和点语法 1>OC内存管理正常情况要使用大量的retain和relrese操作 2>点语法可以减少使用re ...