HTML5/Javascript/jQuery 音频播放器不响应事件？
Posted
技术标签:
【中文标题】HTML5/Javascript/jQuery 音频播放器不响应事件？【英文标题】：HTML5/Javascript/jQuery audio player isn't responding to events? 【发布时间】：2017-04-28 17:37:48 【问题描述】：我正在尝试制作一个带有播放列表的 html5 播放器，这样当一首歌结束时，下一首歌会自动开始。
我正在使用 jQuery。
这是我的 javascript：
$(function()
var player = $('#player')
var index = 0
var CurrentTime = 0
var tracks = [ 'source' : 'audio1.mp3',
'source' : 'audio2.mp3',
'source' : 'audio3.mp3']
var CurrentTrack = tracks[index]
function updateCookie()
Cookies.set('trackIndex', index)
Cookies.set('time', CurrentTime)
//Check if the user has been here before
if(!!Cookies.get('trackIndex'))
updateCookie()
else
index = Cookies.get('trackIndex')
CurrentTime = Cookies.get('time')
function playerSetUp()
player[0].currentSrc = CurrentTrack.source
player[0].currentTime = CurrentTime
player.bind('ended',function()
index++
player[0].currentSrc = CurrentTrack.source
console.log($('#player').currentSrc)
player[0].load()
player[0].play()
)
player.bind('pause',function()
CurrentTime = $('#player').currentTime
updateCookie()
)
)
这是我的html：
<html>
<head>
<title>Mixtape</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-
3.2.1.min.js"></script>
<script src="js.cookie.js"></script>
<script type="text/javascript" src="player.js"></script>
<head>
<body>
<audio controls autoplay id='player'>
<source src="audio1.mp3">
Fallback
</audio>
</body>
我想创建一个模仿模拟录音带行为的播放器。我希望它一首接一首地播放歌曲，当您关闭页面并再次打开时，播放器将从上一首曲目和您暂停的时间继续播放。
问题是我上面的代码没有响应事件。
我做错了什么？
【问题讨论】：
【参考方案1】：您的代码中有三个错误，事件侦听器正在工作。 使用：
//Check if the user has been here before
if(!Cookies.get('trackIndex'))
updateCookie()
CurrentTrack = tracks[index]
else
index = Cookies.get('trackIndex')
CurrentTime = Cookies.get('time')
CurrentTrack = tracks[index]
（只有一个“！”）。并且每次修改“索引”时都需要更新“CurrentTrack”，因为您只需设置一次 currentTrack。
还有：
playerSetUp();
player.bind('ended', function()
index++;
index = index % tracks.length
CurrentTrack = tracks[index]
player[0].currentSrc = CurrentTrack.source
console.log(player[0].currentSrc)
player[0].load()
player[0].play()
)
player.bind('pause', function()
CurrentTime = player[0].currentTime
updateCookie()
)
您需要调用 playerSetUp() 和 index = index % tracking.length 以使您的索引不会大于您的曲目数组。
还有一点：player[0].currentSrc 是只读的。您需要使用player[0].src。
【讨论】：
以上是关于HTML5/Javascript/jQuery 音频播放器不响应事件？的主要内容，如果未能解决你的问题，请参考以下文章