自动列出目录中的特定文件并在页面上显示它们

时间:2015-01-23 02:24:32

标签: javascript php html

我创建了一个网络MP3播放器,它运行正常,我只需要在每次在网络服务器上添加新歌曲时编辑我的脚本。当我添加更多歌曲时,我希望列表自动更新。我的脚本基本上是这样的:

<body>
    <audio id="audio" preload="auto" tabindex="0" controls="" type="audio/mpeg">

    </audio>
    <ul id="playlist">
        <li class="active"><a href="usb/music1.mp3">Music 1</a></li>
        <li><a href="usb/music2.mp3">Music 2</a></li>
        <li><a href="usb/music3.mp3">Music 3</a></li>
        <li><a href="usb/music4.mp3">Music 4</a></li>

    </ul>
</body>

我的音乐文件都位于/www/usb我试过这样的事情:

<?php
...............
echo '
<body>
    <audio id="audio" preload="auto" tabindex="0" controls="" type="audio/mpeg">

    </audio>
    <ul id="playlist">';
exec('find /www/usb/ -name "*.mp3"',$list);
$x=0;
while($x<count($list)){   
if($list[$x]==$h[0]){
echo '<li class="active"><a href="$list[$x]">$list[$x]</a></li>';

$x++;
}
}
echo '
</ul>
</body>
</html>';
?>

但是它给了我以下错误:Fatal error: Maximum execution time of 30 seconds exceeded in /www/test2.php on line 64

我的完整脚本:

<?php
echo '
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#playlist,audio{background:#666;width:400px;padding:20px;}
.active a{color:#5DB0E6;text-decoration:none;}
li a{color:#eeeedd;background:#333;padding:5px;display:block;}
li a:hover{text-decoration:none;}
</style>
    <script type="text/javascript" src="jquery-1.11.2.min.js"></script>
    <script type="text/javascript">
var audio;
var playlist;
var tracks;
var current;

$(document).ready(function() {
  init();
});
function init(){
    current = 0;
    audio = $("audio");
    playlist = $("#playlist");
    tracks = playlist.find("li a");
    len = tracks.length - 1;
    audio[0].volume = .10;
    audio[0].play();
    playlist.find("a").click(function(e){
        e.preventDefault();
        link = $(this);
        current = link.parent().index();
        run(link, audio[0]);
    });
    audio[0].addEventListener("ended",function(e){
        current++;
        if(current == len){
            current = 0;
            link = playlist.find("a")[0];
        }else{
            link = playlist.find("a")[current];    
        }
        run($(link),audio[0]);
    });
}
function run(link, player){
        player.src = link.attr("href");
        par = link.parent();
        par.addClass("active").siblings().removeClass("active");
        audio[0].load();
        audio[0].play();
}
</script>
</head>
<body>
    <audio id="audio" preload="auto" tabindex="0" controls="" type="audio/mpeg">

    </audio>
    <ul id="playlist">';
exec('find /www/usb/ -name "*.mp3"',$list);
$x=0;
while($x<count($list)){   
if($list[$x]==$h[0]){
echo '<li class="active"><a href="$list[$x]">$list[$x]</a></li>';

$x++;
}
}
echo '
</ul>
</body>
</html>';
?>

我该如何解决?请注意,我也希望能够在子目录中搜索。谢谢。

更新1 我尝试了@RhapX建议,但显示的结果是这样的,每当我点击music1.mp3music2.mp3时,它都不会播放因为网址是http://192.168.1.1/music1.mp3http://192.168.1.1/music2.mp3,其中实际位置为http://192.168.1.1/usb/music1.mp3 enter image description here

1 个答案:

答案 0 :(得分:0)

以下函数允许您扫描主目录及其所有子目录,并仅列出具有允许文件类型的结果,如$allowedExtensions数组中所示。

<?php
function getFiles($path = '/www/usb') {

    // Open the path set
    if ($handle = opendir($path)) {

        // Loop through each file in the directory
        while ( false !== ($file = readdir($handle)) ) {

            // Remove the . and .. directories
            if ( $file != "." && $file != ".." ) {

                // Check to see if the file is a directory
                if( is_dir($path . '/' . $file) ) {

                    // The file is a directory, therefore run a dir check again
                    getFiles($path . '/' . $file);

                }

                // Get the information about the file
                $fileInfo = pathinfo($file);

                // Set multiple extension types that are allowed
                $allowedExtensions = array('mp3', 'wav', 'ogg', 'flac');

                // Check to ensure the file is allowed before returning the results
                if( in_array($fileInfo['extension'], $allowedExtensions) ) {
                    echo '<li class="active"><a href="' . $path . '/' . $file . '">' . $file . '</a></li>';
                }

            }
        }

        // Close the handle
        closedir($handle);
    }
} 
?>

通过调用要显示列表的功能

来使用

<?php getFiles(); ?>

您可以通过将其传递给函数来更改要扫描的根路径。

示例:<?php getFiles('/www/music'); ?>

这将遍历您目录中的每个文件,并删除可能存在的...个文件,只保留您的音乐文件。

正如Hobo Sapien所说,你的循环在FALSE返回时变为无限,这可能是你执行时间耗尽的原因。

通过使用这个简单的脚本,您可以在目录/子目录中提取每个文件,无论它如何命名而不将脚本置于无限循环中。