<!DOCTYPE HTML>

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title> </head>
<body> 音乐
<audio src="b.mp3" controls="controls" preload id="music1" hidden>
</audio>
<span id="bf" onclick="bf();">播放/暂停</span>
<span id="bf" onclick="rbf();">重新播放</span>
<script>
function rbf(){
var audio = document.getElementById('music1');
audio.currentTime = 0;
}
function bf(){
var audio = document.getElementById('music1');
if(audio!==null){
//检测播放是否已暂停.audio.paused 在播放器播放时返回false.
alert(audio.paused);
if(audio.paused) {
audio.play();//audio.play();// 这个就是播放
}else{
audio.pause();// 这个就是暂停
}
}
} </script>
</body>
</html>

js控制html5 audio的暂停、播放、停止的更多相关文章

  1. HTML5 audio 如何实现播放多个MP3音频

    <audio>标签是HTML5中的新标签,定义声音用于嵌入音频内容,比如音乐或其他音频流.用的比较多音频格式是.mp3. <audio>标签常用属性如下表 属性 值 描述 au ...

  2. html5 audio标签切换播放音乐的方法

    html5 audio标签切换播放音乐的方法<pre><audio id="music1" preload loop="loop">&l ...

  3. html5 audio的暂停与播放

    在html5里,audio是新增的功能.它方便了用户. 大多数音频是通过插件(比如 Flash)来播放的.然而,并非所有浏览器都拥有同样的插件. HTML5 规定了一种通过 audio 元素来包含音频 ...

  4. HTML5使用JavaScript控制<audio>音频的播放

    1.播放音乐最简单的样例 <audio controls> <source src="horse.mp3" type="audio/mpeg" ...

  5. js获取html5 audio 音频时长方法

    <audio src="我的好兄弟.mp3" controls="controls"  id="audio" style=" ...

  6. js控制html5 【video】标签中视频的播放和停止

    需求:页面中有2个普通按钮a,b.还有一个video标签,能成功播放出视频..我想要的效果是,点击a按钮,视频开始播放,点击b按钮,视频播放停止!!!<br><br>----- ...

  7. ios html5 audio 不能自动播放

    //修复ios 浏览器不能自动播放音频的问题 在加载时创建新的audio 用的时候更换src即可 Xut.fix = Xut.fix||{}; if (Xut.plat.isBrowser & ...

  8. html - html5 audio 音乐自动播放,循环播放等

    转自:http://blog.csdn.net/u012246458/article/details/50618759 audio播放音乐 <audio id="audio" ...

  9. MUI音乐播放html5+audio模块

    html5+ audio 模块MUI播放音频 Audio模块用于提供音频的录制和播放功能,可调用系统的麦克风设备进行录音操作,也可调用系统的扬声器设备播放音频文件.通过plus.audio获取音频管理 ...

随机推荐

  1. Visual Studio 2015 开发MVC4出现错误

    在Visual Studio 2015(以下简称VS2015)中开发MVC4项目时,编译报错"当前上下文中不存在ViewBag",一直无法编译,这个是否是VS2015的Bug? 本 ...

  2. MVC4过滤器(转)

    先来看看一个例子演示过滤器有什么用: public class AdminController : Controller { // ... instance variables and constru ...

  3. IOS中对于一些控件的抖动效果

    这两天在网上看到一个帖子讨论关于有些app 输入账密时候 错误的话会有抖动效果出现,然后自己琢磨了下如何实现,下面上代码!!! 首先 写一个UIView的分类 #import <UIKit/UI ...

  4. FileUpload

    一upload原理: 1.表单的method必须是post方法 2.enctype属性必须是“mutipatr/form-data”类型 enctype默认的属性是“application/x-www ...

  5. BestCoder Round #81 (div.2)1001

    Machine Accepts: 580 Submissions: 1890 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65 ...

  6. sublime快捷键保存

    快捷键 功能 ctrl+shift+n 打开新Sublime ctrl+shift+w 关闭Sublime,关闭所有打开文件 ctrl+shift+t 重新打开最近关闭文件 ctrl+n 新建文件 c ...

  7. Avro基础

    一.Avro的基本功能 1.定义了数据模式文件的语法,一般使用json文件.以及一些数据基本类型与复杂类型. 2.定义了数据序列化到文件后的数据格式,此格式可供各种语言进行读取. 3.为部分语言定义了 ...

  8. 文件:因为懂你,所以永恒 - 零基础入门学习Python028

    文件:因为懂你,所以永恒 让编程改变世界 Change the world by program 因为懂你,所以永恒 大多数的程序都遵循着:输入->处理->输出的模型,首先接受输入数据,然 ...

  9. 迁移笔记:php缓存技术memcached

    1)memcached 的几个指令: -p监听的端口 -l连接的IP地址, 默认是本机 -d start启动memcached服务 -d restart重起memcached服务 -d stop|sh ...

  10. spring boot之使用springfox swagger展示restful的api doc

    摘要 springfox swagger展示restful的api doc, swagger is A POWERFUL INTERFACE TO YOUR API. 新增文件: import org ...