简体   繁体   English

HTML5音频播放器可以播放多首歌曲吗

[英]Can Html5 audio player play more then one song

I'm using php glob() to get a list of the songs in a folder then use the shuffle() to shuffle the songs then use the foreach loop to loop through the songs. 我正在使用php glob()获取文件夹中歌曲的列表,然后使用shuffle()来随机播放歌曲,然后使用foreach循环遍历这些歌曲。 but I can only get on song to play. 但我只能上歌播放。 I'm trying to get it to play one song then when one song is over start another song automatically Iv done a lot of googling but cant seem to find any thing is this only possible with icecast? 我试图让它播放一首歌,然后当一首歌结束时自动启动另一首歌。Iv做了很多谷歌搜索,但似乎找不到任何东西,只有冰封才能做到这一点吗? all post my code below 全部在下面发布我的代码

          <!DOCTYPE HTML>
          <html>


          <head>
          <title>ymp</title>

         <link rel="stylesheet" href="style.css" type="text/css" />

         </head>
          <body>
          <h1>YMP RADIO</h1>
          <?php require ("dropmenu.html"); ?>




           <?php     

            $music = glob("songs/*");  // get all files in the music directory
            shuffle($music);
            foreach ($music as $song){           // try and loop a random songs

            print <<<WTF

            <audio id="player" src="$song" type="audio/mpeg"></audio>
            <audio id="player" src="$song" type="audio/ogg"></audio>

             WTF;

             }
             var_dump($song);
             ?>

             <div> 
             <table border="1px" >
             <tr>

             <td class="tdpage" >
             <img src="ymplogo5.jpg" alt=""  />
         <p><button  class="botton";   onclick="document.getElementById('player').play()">Play</button>
         <button     class="botton";   onclick="document.getElementById('player').pause()">Pause</button>
        <button     class="botton";   onclick="document.getElementById('player').volume+=0.1">Volume up </button>
       <button     class="botton";   onclick="document.getElementById('player').volume-=0.1">Volume down</button>

    </td>
    </tr>
    </table>    
    </div> 

    <br /><br /><br />
    </body>
    </html>

ugh, so if I understand your question correctly, you seem to be wanting to implement user interaction feature (playlists) via server side processing (php). 嗯,所以,如果我正确理解您的问题,您似乎想通过服务器端处理(php)实现用户交互功能(播放列表)。 Unfortunately this won't work. 不幸的是,这行不通。 Your php only provides the urls of the songs. 您的php仅提供歌曲的网址。 The rest of the work lies on client side work like js. 其余工作位于js之类的客户端工作上。 You can do the following (but let me warn you it's not as simple as I think you take it to be) 您可以执行以下操作(但请允许我警告您,它并不像我认为的那么简单)

  • Take the url list from php and echo it in a script tag and store it in a js variable. 从php获取网址列表,并将其回显到脚本标签中,并将其存储在js变量中。
  • Then use js to play the first song (keep in mind we will only be using one audio tag) 然后使用js播放第一首歌曲(请记住,我们只会使用一个音频标签)
  • Then listen for an event listener that tells the js when the song ends, and when it does, play the next song (replace the url with the new one). 然后侦听一个事件侦听器,该事件侦听器告诉js这首歌何时结束,何时结束,播放下一首歌曲(将URL替换为新的)。

Most of your work will be in js and not in php. 您的大部分工作将使用js而不是php。 And even when you do this, this will only make a bare bones media player. 即使执行此操作,也只能使您成为媒体播放器。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM