1. html5 样式

<audio class="audioleft download" id="audVoice" type="audio/mpeg" autoplay="autoplay">
<source src="" id="audSource" />
</audio>

这种方法写完之后播放不了,原因不明

解决办法:

<audio class="audioleft download" id="audVoice"  type="audio/mpeg" src="" preload="auto" oncanplay="addTime()"></audio>

可以成功播放

type="audio/mpeg" 播放MP3格式的

preload="auto"  预加载 默认auto

oncanplay="addTime()"  //当加载完成调用此方法 oncanplay 监听

将获取的音频写到标签中

function addTime(){
//将语音的时间写上去
var mpLength=seToMi($("#audVoice")[0].duration);
//将时间写上去
$("#mpLength").html(mpLength);
}

播放:$("#audVoice")[0].play();

停止:$("#audVoice")[0].pause();

html5 页面音频的更多相关文章

  1. html5页面怎么播放音频和视频

    html5页面怎么播放音频和视频 一.总结 一句话总结:html5 音频和视频标签:(audio And video),局限是不同浏览器对音频视频的格式支持很让人头痛 1.最基础的音频和视频标签的使用 ...

  2. html5 audio音频播放全解析

    序 html5开启了一个新时代,因为它让浏览器本身变得不那么被动,audio api就是一个典型的列子,在html5还没确定之前,如果想要在网页上听音乐看视频唯一的办法就是用flash意思是当你没有给 ...

  3. HTML5: HTML5 Audio(音频)

    ylbtech-HTML5: HTML5 Audio(音频) 1.返回顶部 1. HTML5 Audio(音频) HTML5 提供了播放音频文件的标准. 互联网上的音频 直到现在,仍然不存在一项旨在网 ...

  4. 基于html5页面滚动背景图片动画效果

    基于html5页面滚动背景图片动画效果是一款带索引按钮的页面滚动动画特效代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="fullpage&q ...

  5. HTML5 页面制作工具

    https://www.zhihu.com/question/30087283 HTML5 页面制作工具 免费的基于 HTML 5 的 Web Apps 生成器工具网站     81 235 初页 制 ...

  6. 微信HTML5页面设计建议

    一个HTML5页面从提出到完成上线的流程:>   1.需求方.设计人员.H5实现人员三方共同讨论实现方案 2.设计人员出设计图 3.H5人员按设计图出H5页面 4.需求方评估已实现的H5页面后给 ...

  7. html5页面与android页面之间通过url传递参数

    html5页面与android页面之间可以通过url传递参数,android将参数放在htm5的url  ?后面,js获取url  ?号后面的参数. 方法一: <scrīpt> /* 用途 ...

  8. 转:HTML5页面如何在手机端浏览器调用相机、相册功能

    HTML5页面如何在手机端浏览器调用相机.相册功能 开发微信端浏览器访问的HTML5的页面,页面中有一个<input id="input" type="file&q ...

  9. HTML5页面开发的基础性模板

    分享一个HTML5页面开发的基础性模板,包含了两个版本: 开发版本 注释版本 开发版本 <!DOCTYPE html> <html> <head> <meta ...

随机推荐

  1. Django学习系列之CSRF

    Django CSRF 什么是CSRF CSRF, Cross Site Request Forgery, 跨站点伪造请求.举例来讲,某个恶意的网站上有一个指向你的网站的链接,如果 某个用户已经登录到 ...

  2. windows 7 文件加密设置

    方法/步骤1 加密文件 1 右击需加密的文件,选择“属性”命令. 2 在属性对话框的“常规‘选项卡中单击”高级“按钮. 3 在弹出的对话框中选中”加密内容以便保护数据“复选框,单击”确定“按钮. 4 ...

  3. 绑定服务时什么时候调用onRebind

    Serivce中onRebind被调用的时机非常特别,想知道什么时候onRebind被调用,能够接以下的次序来学习.最后自然就明确了! 1. 首先要知道.同一个服务既可能被启动也能够被绑定; 2. S ...

  4. AutoCAD如何编辑块,打散块

    选中块之后,点击最右侧的最后一个工具"分解"即可.  

  5. 玩转单元測试之WireMock -- Web服务模拟器

    WireMock 是一个灵活的库用于 Web 服务測试,和其它測试工具不同的是.WireMock 创建一个实际的 HTTPserver来执行你的 Web 服务以方便測试. 它支持 HTTP 响应存根. ...

  6. 在C++代码中调用L脚本语言

    L脚本语言同意被其他编程语言调用.如C++,非常easy.仅仅要在宿主语言中载入L脚本引擎的动态库 直接调用这两个函数就能够了 extern "C" int __stdcall S ...

  7. 一张图轻松记住PHP的*类*以及private和protected的区别

    上图概要的说了下php类的特性,类的方法同属性类似. 图中B类继承自A类,B是A的子类,$x和$y都是B的实例化对象. 1. 原型引用:[A::    . B::   ],仅限public stati ...

  8. 关于hive

    这两天在研究了hbase,hadoop,hive,spark 由于spark.py不支持clust(jar才支持,但是太麻烦了>_<) 所以最终决定使用hive 在hive中用create ...

  9. Python Tricks(十九)—— switch 的实现

    python 原生语法不支持 switch,体现了 Python 大道至简的设计思路,有时为了避免啰嗦的 if elif等判断语句,我们可以用字典来代替 switch 的各分支,也即建立表达式和操作的 ...

  10. bzoj1036 [ZJOI2008]树的统计Count——LCT

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1036 LCT水题! 然而没有1A(咬牙)! 注意值有负数,所以取 max 的话要把作为“哨兵 ...