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. Android Wear - App Structure for Android Wear(应用结构)

    ---------------------------------------------------------------------------------------------------- ...

  2. C#.NET 无法直接启动带有类库输出类型的项目怎么办

    我把Driver.cs文件去掉了一行注释,发现报错   右击这个解决方案,选择属性,然后再启动项目中改成MySample    

  3. 策略模式&反射

    业务代码 class Operate { public string _firstKey; public string _secondKey; public string _extendKey; pu ...

  4. [DLX反复覆盖] poj 1084 Square Destroyer

    题意: n*n的矩形阵(n<=5),由2*n*(n+1)根火柴构成,那么当中会有非常多诸如边长为1,为2...为n的正方形,如今能够拿走一些火柴,那么就会有一些正方形被破坏掉. 求在已经拿走一些 ...

  5. web container和spring container之间的关系

    1 tomcat是一个web container,它提供java web应用的运行环境,因为它实现了好多java ee规范,比如java Servlet.JSP等,也就是说,没有它,java web应 ...

  6. tracert 路由跟踪程序

    C:\Users\Administrator>tracert 10.0.0.1 通过最多 30 个跃点跟踪到 10.0.0.1 的路由 1 <1 毫秒 1 ms 3 ms 192.168. ...

  7. 使Android 自带SDK 完美支持HTML5 之 html5webview

    HTML5出来之后,webkit 大部分都支持了,但是由于历史原因,支持限度有限,我在Android 4.0使用 hao123的客户端访问youxi.cn期望可以万网手机HTML5游戏但是有些失望,进 ...

  8. jquery easyui 显示和关闭数据加载的遮罩

    $('#yearReportTable').datagrid('loading');//打开等待div $('#yearReportTable').datagrid('loaded');//关闭等待d ...

  9. 【145】◀▶ .NET Framework类库索引

    C#编程基础: A1 ………… 基础A2 ………… using 关键字A3 ………… as 关键字A4 ………… is 关键字A5 ………… switch 关键字A6 ………… return 语句关键 ...

  10. SpringBoot中使用spring-data-jpa 数据库操作(上)

    Java客户端使用Spring-Data-Jpa这个组件. Spring-Data-Jpa就是Spring对Hibernate的一个整合. 选择create在运行的时候它会自动帮我们创建一个表. sp ...