自定义内容包括,播放,暂停,停止,上一首,下一首,进度条显示,进度条拖动并实时显示拖动位置
注:此代码因为有ajax跟服务器的通讯,所以是放在wampsever环境中运行,读者可以自行先替换默认播放的音乐,查看播放,暂停,停止,进度条拖动及显示拖动进度的效果。php代码就不贴了。
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery-2.1.4.js"></script>
</head>
<body>
<audio id="audio" src="audios/李荣浩 - 笑忘书(live).mp3" controls="controls"></audio>
<p>剩余播放时间:<span id="showTime"></span><span id="showDragTime"></span></p>
<div id="timeBar" style="height:5px; width:300px; border:1px solid