今天一个朋友问我js顺序播放音乐列表中的音乐的问题，我仔细一想，我也没有做过啊，无从下手啊，怎么办？然后我就上网查了一下audio标签，又百度了js如何顺序播放音乐，结果就找到了解决的办法。

audio标签有一个方法是onended，W3C对它的解释是“当媒介已到达结尾时运行的脚本（可发送类似“感谢观看”之类的消息）。”这么问题就迎刃而解了。

直接上代码：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

</head>

<body>

<audio controls="controls" autoplay="autoplay" id="audio" src="http://so1.111ttt.com:8282/2016/1/12m/10/205102159306.m4a?tflag=1491889514&pin=1d78d27553feb8fb49894cc570a4e497&ip=180.173.30.102#.mp3" style="width:500px;"></audio>

<script type="text/javascript">

var i = 0;

var audios=[

	"http://so1.111ttt.com:8282/2016/5/12m/10/205101601572.m4a?tflag=1491889763&pin=00b0e3cfdc2727028c8cd40a3913cd34&ip=180.173.30.102#.mp3",

	"http://so1.111ttt.com:8282/2016/5/12m/10/205101416298.m4a?tflag=1491889789&pin=ca21cf0765639847b78d5fea2d9568ae&ip=180.173.30.102#.mp3",

	"http://so1.111ttt.com:8282/2016/1/12m/10/205101007238.m4a?tflag=1491890978&pin=6ae41be616c20b7e1224e935de8c2c2d&ip=180.173.30.102#.mp3"

	];

document.getElementById("audio").onended = function(){

	if(audios[i]){

		this.setAttribute('src',audios[i]);i++;

	}else{

		alert('没有音乐了');

	}

};

</script>

</body>

</html>

js顺序播放列表中的音乐的更多相关文章

  1. iOS开发系列--扩展--播放音乐库中的音乐

    众所周知音乐是iOS的重要组成播放,无论是iPod.iTouch.iPhone还是iPad都可以在iTunes购买音乐或添加本地音乐到音乐 库中同步到你的iOS设备.在MediaPlayer.fram ...

  2. jplayer中动态添加列表曲目（js提取request中的list数据作为js参数使用）

    jplayer 的播放列表使用如下: $(document).ready(function(){ new jPlayerPlaylist({ jPlayer: "#jquery_jplaye ...

  3. D3.js使用过程中的常见问题(D3版本D3V4)

    目录 一.学习D3我必须要学习好SVG矢量图码? 二.如何理解D3给Dom节点绑定数据时的Update.Enter和Exit模式 三.D3绑定数据时用datum与data有什么不一样? 四.SVG图中 ...

  4. js原型对象中属性被覆盖(1)

    /**   *@author 程无衣   *@description 关于在原型对象中属性被覆盖   */       function Person(){}       Person.prototy ...

  5. js插件---videojs中文文档详解

    js插件---videojs中文文档详解 一.总结 一句话总结: js插件网上都有很多参考资料,使用起来也非常简单 二.lavarel中使用实例 <video id="example_ ...

  6. Js文件函数中调用另一个Js文件函数的方法

    在项目中Js文件需要完成某一功能,但这一功能的大部分代码在另外一个Js文件已经完成,只需要调用这个文件实现功能.那么如何调用:一个Js文件函数中调用另一个Js文件函数的方法? (直接代码说明) 示例d ...

  7. 找到你的位置（JS在页面中的位置）最常用的方式是在页面中head部分放置<script>元素，浏览器解析head部分就会执行这个代码，然后才解析页面的其余部分

    找到你的位置(JS在页面中的位置) 我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分. 放在<head>部分 最常用的方式是在页 ...

  8. js 在浏览器中的event loop事件队列

    目录 前言 认识一个栈两个队列 执行过程 异步任务怎么分配 简单例子 难一点的例子 前言 以下内容是js在浏览器中的事件队列执行,与在nodejs中有所区别,请注意. 都说js是单线程的,不过它本身其 ...

  9. js获取URL中的参数

    js获取URL中的一些参数的意思 location对象 含有当前URL的信息. 属性 href 整个URL字符串. protocol 含有URL第一部分的字符串,如http: host 包含有URL中 ...

随机推荐

  1. [转]Java Web笔记：搭建环境和项目配置（MyEclipse 2014 + Maven + Tomcat）

    来源:http://www.jianshu.com/p/56caa738506a 0. 绪言 Java Web开发中,除了基础知识外,开发环境搭建,也是一项基本功.开发环境包括了IDE.项目管理.项目 ...

  2. [转]编程珠玑第五章二分搜索(折半查找)之java实现

    http://blog.csdn.net/hwe_xc/article/details/51813080 二分搜索又称为折半查找,用来高效快速的解决如下问题: 我们需要确定排序后的数组x[0..n-1 ...

  3. 从源码开始运行Bitcoin Core

    安装Ubuntu 环境:虚拟机 网络连接:桥接 系统版本:16.04 源:ali 安装编译环境(依赖库) sudo apt-get update sudo apt-get install build- ...

  4. tomcat配置介绍

    第一节java的介绍 java需要一个java的运行环境 JDK:包含了好几个java组件,包含类库(API) 开发工具(java) jvm(java虚拟机)JRE(类库) tomcat:开源  企业 ...

  5. DC3求后缀数组板子

    #include<bits/stdc++.h> #define LL long long #define fi first #define se second #define mk mak ...

  6. 清除DNS缓存（解决能上QQ但是无法上网页问题）

    ipconfig/displaydnsipconfig/flushdns

  7. 063 SparkStream数据接收方式

    1.两种方式 2.Basic Source 由StreamingContext可以提供的API 上面做的wordcount中的方式就算是第一种方式. 3.Advanced Source 使用数据接收器 ...

  8. count()函数在count()中参数的讨论

    http://www.cnblogs.com/CareySon/p/DifferenceBetweenCountStarAndCount1.html

  9. Linux学习笔记6

    less 命令 空格或者 ctrl+f  前进一屏 ctrl+b  回退一屏 回车    前进一行 /String 查找含有string 字符串的页 ?String  同上 <反方向查找> ...

  10. mongoose update操作属性中的变量

    最近在学习mongoose操作数据库,利用schema模型.记录一下通过使用update()操作实现数据库更新: 可在属性中添加变量,'属性名.0',可以修改该属性的第一条属性,依次类推,但是如果想实 ...