html5的audio标签只在火狐下支持wav格式的音频播放,无法兼容IE和google ,

使用audioplayer.js 基本上能支持大部分浏览器播放wav音频文件,经测试IE、火狐、google浏览器都可以播放编码格式为:

的wav格式的音频

当audio标签不支持或者audio不能播放相应格式的文件时,播放器将使用迷你模式,使用embed元素来播放音频,支持的功能将较少,并且各浏览器支持功能不一致

使用方法:

1、html中加入audio标签

  <audio controls="controls" id="wavAudio">
<source src="https://osvaldas.info/examples/audio-player-responsive-and-touch-friendly/audio.wav" type="audio/wav" />
</audio>

2、引用jquery和audioplayer.js

 <script src="~/Content/assets/js/jquery-1.11.1.min.js"></script>
<script src="~/Content/audioplayer.js"></script>

3、播放器代码

 常用自定义选项

classPrefix    插件插入html的class前缀 
strPlay        播放按钮显示的文字
strPause       暂停按钮显示的文字
strVolume      音量按钮显示的文字
 
 $(function () {
$('audio').audioPlayer({
classPrefix: 'audioplayer',
strPlay: '播放',
strPause: '暂停',
strVolume: '音量'
});
});

audioplayer网站:https://osvaldas.info/audio-player-responsive-and-touch-friendly

最终效果

多浏览器播放wav格式的音频文件的更多相关文章

  1. CEF3 HTML5 audio标签为什么不能播放mp3格式的音频文件

    CEF3 HTML5 audio标签 为什么不能播放mp3格式的音频文件   原因略.   解决方法: 找一个最新版的chrome ,我用的是24版本.路径 C:\Documents and Sett ...

  2. C# 使用System.Media.SoundPlayer播放wav格式的声音文件

    using System.Media; string szPath = Application.StartupPath + “\\SoundFile\\sound.wav”; SoundPlayer ...

  3. 使用jave2实现将wav格式的音频转换成mp3格式

    最近需要用到语音合成功能,网上查阅了一番,发现可以使用腾讯云的语音合成API来完成这个功能,但是腾讯云的api返回的是wav格式的音频文件,这个格式的文件有些不通用,因此需要转换成mp3格式的文件. ...

  4. MmSystem播放Wav格式声音

    //MmSystem播放Wav格式声音 //MmSystem 支持 *.wav声音格式 snd ->SoundRecorderuses MmSystem; //引用MmSystem//播放系统声 ...

  5. c#使用SoundPlayer播放wav格式音频

    1.引用System.Media名称空间下的类SoundPlayer   SoundPlayer player = new SoundPlayer(); 2.方法调用Play(); public vo ...

  6. PJSIP-PJMEDIA【使用pjmedia 播放wav格式的音乐】

    应宝哥建议以及更好的交流学习,这篇开始使用中文,英语就先放一放吧! 要使用PJSIP中的PJMEDIA首先我们需要搭建好它所需要的环境. [环境搭建与调试] 1 在 工具 加入pjmedia所需要的包 ...

  7. CentOS 6.4 播放avi格式的视频文件

    1. 需要先进行相关的yum源的导入: rpm -Uhv http://apt.sw.be/redhat/el6/en/x86_64/rpmforge/RPMS/rpmforge-release-0. ...

  8. linux下alsa架构音频驱动播放wav格式文件

    #include<stdio.h> #include<stdlib.h> #include <string.h> #include <alsa/asoundl ...

  9. 如何将Pcm格式的音频文件转换成Wave格式的文件

    最近在做一款变声App,其中就用到了将pcm格式转wave格式,下面贴出源代码,希望带有需求的童鞋有帮助!!!这里是c++语言写的,也可以用java实现.当然java调用native函数要用到jni技 ...

随机推荐

  1. go微服务框架go-micro深度学习 rpc方法调用过程详解

    摘要: 上一篇帖子go微服务框架go-micro深度学习(三) Registry服务的注册和发现详细解释了go-micro是如何做服务注册和发现在,服务端注册server信息,client获取serv ...

  2. oracle查看当前用户,数据库实例

    #sysdba用户登录[oracle@oracle ~]$ sqlplus / as sysdba #查看当前用户sql>show user; #查看当前数据库实例sql>show par ...

  3. 大牛是怎么思考设计MySQL优化方案

    在进行MySQL的优化之前,必须要了解的就是MySQL的查询过程,很多查询优化工作实际上就是遵循一些原则,让MySQL的优化器能够按照预想的合理方式运行而已. 1.优化的哲学 注:优化有风险,涉足需谨 ...

  4. 高可用Hadoop平台-应用JAR部署

    1.概述 今天在观察集群时,发现NN节点的负载过高,虽然对NN节点的资源进行了调整,同时对NN节点上的应用程序进行重新打包调整,负载问题暂时得到缓解.但是,我想了想,这样也不是长久之计.通过这个问题, ...

  5. 在centos和redhat上安装docker

    前置条件 64-bit 系统 kernel 3.10+一.检查内核版本,返回的值大于3.10即可 $ uname -r 二.使用 sudo 或 root 权限的用户登入终端 三.卸载旧版本(如果安装过 ...

  6. Ubuntu14.04 编译 Android 5.1.1源码(采用国内镜像)

    欢迎转载,转载请注明出处: http://www.cnblogs.com/lanrenxinxin/p/5424554.html 之前就有编译android源码的想法,但是由于有GFW的存在,又没有梯 ...

  7. ELK(elasticsearch+kibana+logstash)搜索引擎(一): 环境搭建

    1.ELK简介 这里简单介绍一下elk架构中的各个组件,关于elk的详细介绍的请自行百度 Elasticsearch是个开源分布式搜索引擎,是整个ELK架构的核心 Logstash可以对数据进行收集. ...

  8. 4款开源免费的数据可视化JavaScript库

    概述:交互式数据可视化在很大程度上取决于JavaScript库的任务能力.在这篇文章中,我们将看看四个JavaScript库:D3,InfoVis,Processing.js,和Recline.js. ...

  9. TCP/IP 详解

    分层 每一层负责不同的功能:     链路层 有时也称作数据链路层或网络接口层, 通常包括操作系统中的设备驱动程序和计算机 中对应的网络接口卡.它们一起处理与电缆(或其他任何传输媒介)的物理接口细节. ...

  10. Java坦克大战(一)

    接下来的几篇博客,想记录一下通过学习坦克大战项目来循序渐进的学习Java基础.主要是为了巩固基础知识,当然学习编程重要的还是多敲,问题通常是在敲代码的过程中发现的,积累也是在敲代码中寻求的经验.这个坦 ...