使用 jQuery/Javascript 播放歌曲
Posted
技术标签:
【中文标题】使用 jQuery/Javascript 播放歌曲【英文标题】：Playing a song using jQuery/Javascript 【发布时间】：2017-11-11 22:24:03 【问题描述】：当文件收到来自 Arduino 的 'playMusic' 事件时，我正在尝试播放歌曲，但我收到了 Uncaught TypeError: Cannot read property 'play' of undefined at EventSource.<anonymous>。我已经读到这可能是因为在歌曲文件准备好之前尝试播放音频，但是在事件侦听器中结合 window.onload 函数不会导致任何事情发生。我在调用事件之前添加了两秒的延迟，以尝试补偿足够的时间来加载歌曲文件，但我仍然遇到同样的错误。
<html>
<title>Song Time</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<body>
<audio id="song">
<source src="song.mp3" type="audio/mpeg">
</audio>
<script type="text/javascript">
var eventSource = new EventSource("https://api.particle.io/v1/devices/2d0024001047363330363431/events/?access_token=bdde583943e53ea709aa421a2e618d024700b2f1");
eventSource.addEventListener('playMusic', function(e)
//window.onload=function()
console.log("here");
$('song')[0].play();
//
);
</script>
</body>
</html>
Uncaught TypeError: Cannot read property 'play' of undefined
at EventSource.<anonymous
【问题讨论】：
$(‘#song’)你忘了#
你的 api 暂时不工作
【参考方案1】：
这个函数似乎是 jQuery 问题，函数 play 在纯 js 中运行良好。
这是sn-p：
document.getElementById("play").addEventListener('click', function(e)
console.log("play");
document.getElementById("song").play();
);
document.getElementById("stop").addEventListener('click', function(e)
console.log("stop");
document.getElementById("song").pause();
document.getElementById("song").currentTime = 0;
);
document.getElementById("pause").addEventListener('click', function(e)
console.log("stop");
document.getElementById("song").pause();
);<html>
<title>Song Time</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<body>
<audio id="song">
<source src="http://www.cedarhome.org/mp3/songs/01%20Battlecry.mp3" type="audio/mpeg">
</audio>
<br />
<input type="button" value="play" id="play" /><br />
<input type="button" value="pause" id="pause" /><br />
<input type="button" value="stop" id="stop" /><br />
</body>
</html>【讨论】：
【参考方案2】：感谢@James
$('#song') 你忘了#——詹姆斯
【讨论】：
以上是关于使用 jQuery/Javascript 播放歌曲的主要内容，如果未能解决你的问题，请参考以下文章
Spotify Web Playback SDK - 播放完整歌曲
使用 MPMediaItemPropertyTitle 播放歌曲