<audio id="audio" controls="controls"  loop="loop" style="display: none;">

     <source src="data:image/3.mp3" type="audio/mpeg" />

 </audio>

 audio.play();//播放

 audio.pause();//暫停

 //监听播放完毕

  audio.addEventListener("ended",function(){

     console.log('播放完毕');

  },false)

监听auduo标签播放的更多相关文章

  1. jquery监听video标签视频播放暂停状态

    由于jquery中没有video的paly,pause方法,所以在使用jquery来控制视频的播放的播放状态时会出现问题 之前的代码: let $video = $('#video'); $('.pl ...

  2. Bootstrap -- 插件: 模态框、滚动监听、标签页

    Bootstrap -- 插件: 模态框.滚动监听.标签页 1. 模态框(Modal): 覆盖在父窗体上的子窗体. 使用模态框: <!DOCTYPE html> <html> ...

  3. JS监听浏览器标签页的显示与隐藏

    /** * 监听浏览器标签页的显示与隐藏 */ class ListenerPageVisibility { constructor () { // 设置隐藏属性和改变可见属性的事件的名称 this. ...

  4. 实时监听input标签输入 实时监听文本框输入 避免中文输入法无法触发onkeyup事件的问题

    前言: 对于实时监听输入,这种需求大多数都是用于一个联想字提醒,智能提醒.大家都知道onkeydown,onkeypress,onkeyup的在监听中文输入法或者右键粘贴的时候都存在一些弊端,不是那么 ...

  5. 监听<input/>标签行为的方法总结

    一.内容改变 1.<input onchange="javascript:function()"/>方法 onchange可以替换为下面几种:oninput,onpro ...

  6. vue监听input标签的value值方法

    <input id="materialSearch" type="text" @keyup.enter="search" @input ...

  7. js监听页面标签切换

    var OriginTitile = document.title, titleTime; document.addEventListener('visibilitychange', function ...

  8. 雷火神山直播超两亿，Web播放器事件监听是怎么实现的？

    Web播放器解决了在手机浏览器和PC浏览器上播放音视频数据的问题,让视音频内容可以不依赖用户安装App,就能进行播放以及在社交平台进行传播.在视频业务大数据平台中,播放数据的统计分析非常重要,所以We ...

  9. Oracle ORA-12541：TNS：无监听程序

    Oracle ORA-12541:TNS:无监听程序 标签: Oracle DataBase 今天使用Oracle数据库,使用可视化连接工具连接测试环境的数据库时提示无监听程序,最后在老师帮助下终于搞 ...

随机推荐

  1. skywalking6.0.0安装配置(windows)，以mysql作为储存。

    下载skywalking6.0.0http://skywalking.apache.org/downloads/ 下载jdk8https://www.oracle.com/technetwork/ja ...

  2. 消息队列——ActiceMQ

    1.下载apache-activemq-5.xx.x,\bin\win64目录下运行activemq.bat.之后可进入管理员界面http://localhost:8161/admin,账号密码均为a ...

  3. JavaScript中作用域和作用域链的简单理解（变量提升）

    通过阅读<JS高级程序设计>这本书,对js中的作用域和作用域链知识有了初步的了解和认识,准备成笔记供大家参考,笔记中字数比较多,但个人认为叙述的挺详细的,所以希望读者耐心看.再者,本人了解 ...

  4. EF Working with Transactions

    原文:https://msdn.microsoft.com/en-us/data/dn456843.aspx Prior to EF6 Entity Framework insisted on ope ...

  5. HTML5_canvas_线性渐变

    canvas 线性渐变 var linearG = pen.createLinearGradient(startX, startY, endX, endY); 两点的连线,决定了渐变的方向,和区间 v ...

  6. 08_ for 练习 _ sumOf7

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  7. ActivityRouter 框架简单实用

    ActivityRouter组件化开发小助手用法如下: 跟目录build.gradle dependencies { // activityRouter classpath 'com.neenbeda ...

  8. 一般处理程序（ashx）的使用

    ASP.NET 中发送请求的页面代码如下: <head runat="server"> <title></title> <script s ...

  9. 一个FORK的面试题（转）

    https://coolshell.cn/articles/7965.html https://coolshell.cn/articles/945.html

  10. Java将Excel解析为数组集合

    Java将Excel解析为数组集合 相关 jar 包: jxl-2.6.jar jar 包下载:http://files.cnblogs.com/files/liaolongjun/excel-jar ...