需要从播放列表中获取歌曲名称到“正在播放”横幅w / php和javascript

我正在使用php和javascript创建一个在线音乐播放器，我无法找出处理问题的最佳方法。 我创建了一个MySQL数据库，用于保存歌曲的名称，艺术家，专辑等。

我从一个XML文件中创建了一个播放列表，该文件是从页面上显示的MySQL数据库生成的，我唯一没有得到的function就是当我点击一首歌时，该歌曲的名称出现在“正在播放”横幅中来自播放列表。

我想我需要某种“onClick”function，但我无法弄明白我需要做什么。 另外，我显然不想刷新页面只是为了播放新歌。

谢谢你的帮助！

我的播放器的基本代码如下。 实际播放器使用自定义界面和XML播放列表，但基本上就是这样。 我只需要弄清楚如何创建“正在播放”function。 谢谢！

   function loadPlayer() { var audioPlayer = new Audio(); audioPlayer.controls="controls"; audioPlayer.addEventListener('ended',nextSong,false); audioPlayer.addEventListener('error',errorFallback,true); document.getElementById("player").appendChild(audioPlayer); nextSong(); } function nextSong() { if(urls[next]!=undefined) { var audioPlayer = document.getElementsByTagName('audio')[0]; if(audioPlayer!=undefined) { audioPlayer.src=urls[next]; audioPlayer.load(); audioPlayer.play(); next++; } else { loadPlayer(); } } else { alert('the end!'); } } function errorFallback() { nextSong(); } function playPause() { var audioPlayer = document.getElementsByTagName('audio')[0]; if(audioPlayer!=undefined) { if (audioPlayer.paused) { audioPlayer.play(); } else { audioPlayer.pause(); } } else { loadPlayer(); } } function pickSong(num) { next = num; nextSong(); } var urls = new Array(); urls[0] = '/testphp/upload/Sleep Away.mp3'; urls[1] = '/testphp/upload/Kalimba.mp3'; urls[2] = '/testphp/upload/Sleep Away.mp3'; urls[3] = '/testphp/upload/Kalimba.mp3'; var next = 0;    
 Play / Pause! | Next!

 Sample 1
 Sample 2
 Missing File
 Sample 3   

Answer 1

我假设您点击的歌曲名称在页面右侧？ 如果是这样，您可以使用jquery获取该名称并将其写入横幅，但就像第一条评论所说的那样，如果没有看到某种代码或示例代码，很难帮助您。

更新：假设你有jquery。

好的，所以你只需要创建一个现在播放的div

对于选择歌曲html，将一个类添加到锚标签类似于class =“songs”然后创建一个jquery函数来捕获单击

 $('a.songs').click(function(){ $('#nowPlaying').html($(this).html()); }); 

我没有测试但它应该工作，这个函数将获取你点击的锚点的html并在nowPlaying中输出它。 对于next（）函数，您只需要在数组的正确位置输出歌曲名称（您必须解析字符串以便输出名称，顺便说一下，数组中的名称应该与html匹配）。 在nextsong函数中有这样的东西

 $('#nowPlaying').html(parseThis(urls[index])); 

你必须定义parseThis来解析你的字符串，所以它给出了歌曲名称而不是整个路径。 或者你可以创建一个只有歌曲名称的不同数组，这样你就可以抓住它。 如果没有下一首歌，请确保您有默认情况，或者您可以回到第一首歌曲，这取决于您。 至少这是逻辑，它相当简单，逻辑也可以改进，但这应该让你开始

Answer 2

你用什么播放器播放音乐文件？ 在我的情况下，我使用在线雅虎网络播放器 ，它很容易集成和使用。 它具有您需要的所有function。 关于你的问题，如果你有：

 The song 

和：

在你的javascript使用中：

 $("#song").click(function(){ $("#now_playing").html() = $(this).html(); });